【民泊5.1】【Windows】ルームインデックス

写真がない場合「blank.jpg」を表示させる記述を追加します。
「app\assets\images」フォルダに「フルコード」の「サンプル画像」にある「blank.jpg」ファイルを保存しておいてください。

記述追加　app\models\room.rb（11行目）

  def cover_photo(size)
    if self.photos.length > 0
      self.photos[0].image.url(size)
    else
      "blank.jpg"
    end
  end

app\models\room.rb

class Room < ApplicationRecord
  belongs_to :user
  has_many :photos

  validates :home_type, presence: true
  validates :room_type, presence: true
  validates :accommodate, presence: true
  validates :bed_room, presence: true
  validates :bath_room, presence: true

  def cover_photo(size)
    if self.photos.length > 0
      self.photos[0].image.url(size)
    else
      "blank.jpg"
    end
  end

end

app\views\rooms\index.html.erb

<div class="row">
  <div class="col-md-3">
    <ul class="sidebar-list">
      <li class="sidebar-item"><%= link_to "登録したお部屋の管理", rooms_path, class: "sidebar-link active" %></li>

    </ul>
  </div>
  <div class="col-md-9">
    <div class="panel panel-default">
      <div class="panel-heading">
        登録しているお部屋の一覧
      </div>
      <br/>
      <div class="panel-body">

        <% @rooms.each do |room| %>
          <div class="row">
            <div class="col-md-2">
                <%= image_tag room.cover_photo(:thumb) %>
            </div>
            <div class="col-md-7">
              <h4><%= room.listing_name %></h4>
            </div>
            <div class="col-md-3 right">
              <%= link_to "お部屋情報の更新", listing_room_path(room), class: "btn btn-form" %>
            </div>
          </div>
          <hr/>
        <% end %>
      </div>
    </div>
  </div>
</div>

app\views\rooms\show.html.erb

<!-- 写真 -->
<div class="row">
  <div class="col-md-12">
    <%= image_tag @room.cover_photo(nil), width: "100%" %>
  </div>
</div>
<br/>

<div class="row">

  <!-- 左パネル -->
  <div class="col-md-8">

    <!-- お部屋の名前 -->
    <div class="row">
      <div class="col-md-8">
        <h1><%= @room.listing_name %></h1>
        <%= @room.address %>
      </div>
      <div class="col-md-4 text-center">
        <%= image_tag @room.user.gravatar_url, class: "img-circle avatar-large" %><br/><br/>
        <%= @room.user.fullname %>
      </div>
    </div>
    <hr/>

    <!-- 部屋のインフォメーション -->
    <div class="row text-babu">
      <div class="row text-center row-space-1">
        <div class="col-md-3">
          <i class="fa fa-home fa-2x"></i>
        </div>
        <div class="col-md-3">
          <i class="fa fa-user-circle-o fa-2x"></i>
        </div>
        <div class="col-md-3">
          <i class="fa fa-bed fa-2x"></i>
        </div>
        <div class="col-md-3">
          <i class="fa fa-bath fa-2x"></i>
        </div>
      </div>

      <div class="row text-center">
        <div class="col-md-3"><%= @room.home_type %></div>
        <div class="col-md-3"><%= pluralize(@room.accommodate, "人宿泊可能") %></div>
        <div class="col-md-3"><%= pluralize(@room.bed_room, "台") %></div>
        <div class="col-md-3"><%= pluralize(@room.bath_room, "部屋") %></div>
      </div>

    </div>
    <hr/>

    <!-- 詳細 -->
    <div class="row">
      <div class="col-md-12">
        <h3>お部屋の詳細</h3>
        <p><%= @room.summary %></p>
      </div>
    </div>
    <hr/>

    <!-- アメニティ -->
    <div class="row">
      <div class="col-md-3">
        <h4>アメニティ</h4>
      </div>

      <div class="col-md-9">
        <div class="row">
          <div class="col-md-6">
            <ul class="amenities">
              <li class="<%= 'text-line-through' if !@room.is_tv %>">テレビ</li>
              <li class="<%= 'text-line-through' if !@room.is_kitchen %>">キッチン</li>
              <li class="<%= 'text-line-through' if !@room.is_internet %>">インターネット</li>
            </ul>
          </div>
          <div class="col-md-6">
            <ul class="amenities">
              <li class="<%= 'text-line-through' if !@room.is_heating %>">暖房</li>
              <li class="<%= 'text-line-through' if !@room.is_air %>">エアコン</li>
            </ul>
          </div>

        </div>
      </div>

    </div>
    <hr/>
    <!-- カルーセル表示 -->
    <div class="row">

      <% if @photos.length > 0 %>
          <div id="myCarousel" class="carousel slide" data-ride="carousel">
          <!-- 表示 -->
          <ol class="carousel-indicators">
            <% @photos.each do |photo| %>
                <li data-target="#myCarousel" data-slide-to="<%= photo.id %>"></li>
            <% end %>
          </ol>

          <!-- スライド -->
          <div class="carousel-inner">
            <% @photos.each do |photo| %>
                <div class="item <%= 'active' if photo.id == @photos[0].id %>">
                  <%= image_tag photo.image.url() %>
                </div>
            <% end %>
          </div>

          <!-- 左右移動 -->
          <a class="left carousel-control" href="#myCarousel" data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left"></span>
            <span class="sr-only">戻る</span>
          </a>
          <a class="right carousel-control" href="#myCarousel" data-slide="next">
            <span class="glyphicon glyphicon-chevron-right"></span>
            <span class="sr-only">次へ</span>
          </a>
        </div>
      <% end %>

    </div>
    <hr/>




  </div>

  <!-- 右パネル -->
  <div class="col-md-4">
    <!-- 予約フォーム -->
  </div>

</div>

記述追加　app\controllers\rooms_controller.rb(24行目)

  def show
    @photos = @room.photos
  end

app\controllers\rooms_controller.rb

class RoomsController < ApplicationController
  before_action :set_room, except: [:index, :new, :create]
  before_action :authenticate_user!, except: [:show]
  before_action :is_authorised, only: [:listing, :pricing, :description, :photo_upload, :amenities, :location, :update]

  def index
     @rooms = current_user.rooms
  end

  def new
    @room = current_user.rooms.build
  end

  def create
    @room = current_user.rooms.build(room_params)
    if @room.save
      redirect_to listing_room_path(@room), notice: "保存しました。"
    else
      flash[:alert] = "問題が発生しました。"
      render :new
    end
  end

  def show
    @photos = @room.photos
  end

  def listing
  end

  def pricing
  end

  def description
  end

  def photo_upload
      @photos = @room.photos
  end

  def amenities
  end

  def location
  end

  def update

    new_params = room_params
    new_params = room_params.merge(active: true) if is_ready_room

    if @room.update(new_params)
      flash[:notice] = "保存しました。"
    else
      flash[:alert] = "問題が発生しました。"
    end
    redirect_back(fallback_location: request.referer)
  end

  private

    def set_room
      @room = Room.find(params[:id])
    end

    def is_authorised
      redirect_to root_path, alert: "権限がありません。" unless current_user.id == @room.user_id
    end

    def is_ready_room
      !@room.active && !@room.price.blank? && !@room.listing_name.blank? && !@room.photos.blank? && !@room.address.blank?
    end

    def room_params
      params.require(:room).permit(:home_type, :room_type, :accommodate, :bed_room, :bath_room, :listing_name, :summary, :address, :is_tv, :is_kitchen, :is_air, :is_heating, :is_internet, :price, :active)
    end

end

ブラウザ確認
表示されるか確認して下さい。
http://localhost:3000/rooms
http://localhost:3000/rooms/1

学生向けプログラミング入門 | 無料

学生向けにプログラミングを無料で解説。Java、C++、Ruby、PHP、データベース、Ruby on Rails, Python, Django