戻る

Rails5.0


民泊サイトの構築 Rails5.0

  (0)
2,000円

タスク5-9   ページ修正

このタスクについて


タスクの内容を一部抜粋します。
プロジェクトを購入していただくとこのタスクの内容の全てを読みやすい表示で見ることができます。
プログラムコードが色分けされて見やすくなります。
プログラムコードに行番号が付きます。
本文が色分けされて見やすくなります。
そしてこのアプリケーションのフルコードをダウンロードすることが可能になります。




ナビゲーションバーを更新します。
リンクを追加して2本目のナビゲーションバーを追加しました。



更新 app\views\shared\_navbar.html.erb
 
<!-- ナビゲーションバー --> 
<nav class="navbar navbar-default navbar-static-top"  style ="margin: 0;"> 
  <div class="container"> 
    <div class="navbar-header"> 
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
        <span class="sr-only">ナビゲーション トグル</span> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
      </button> 
      <%= link_to "テストサイトMinpaku", root_path, class: "navbar-brand" %> 
    </div> 
    <div id="navbar" class="navbar-collapse collapse"> 
      <ul class="nav navbar-nav navbar-right"> 
        <% if (!user_signed_in?) %> 
            <li><%= link_to "ログイン", new_user_session_path %></li> 
            <li><%= link_to "新規ユーザ登録", new_user_registration_path %></li> 
        <% else %> 
            <li class="dropdown"> 
              <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> 
                <!-- アバター画像 --> 
                <%= image_tag current_user.gravatar_url, class: "img-circle avatar-small" %>&nbsp; 
                <!-- 氏名表示に変更 --> 
                <%= current_user.fullname %> 
                <span class="caret"></span> 
              </a> 
              <ul class="dropdown-menu"> 
                <li><%= link_to "ダッシュボード", dashboard_path %></li> 
                <li><%= link_to "登録したお部屋の管理", rooms_path %></li> 
                <li><%= link_to "お部屋の新規登録", new_room_path %></li> 
                <li><%= link_to "受注予約の管理(ホスト用)", your_reservations_path %></li> 
                <li><%= link_to "予約履歴(ゲスト用)", your_trips_path %></li> 
                <li><%= link_to "ホスト用カレンダー", host_calendar_path %></li> 
                <li><%= link_to "収益", revenues_path %></li> 
                <li><%= link_to "クレジットカード登録", payment_method_path, data: { turbolinks: false} %></li> 
                <li><%= link_to "振り込み口座登録", payout_method_path %></li>                
                <li role="separator" class="divider"></li> 
                <li><%= link_to "ユーザ登録情報修正", edit_user_registration_path %></li> 
                <li><%= link_to "ログアウト", destroy_user_session_path, method: :delete %></li> 
              </ul> 
            </li> 
        <% end %> 
      </ul> 
    </div> 
  </div> 
</nav> 
<% if (user_signed_in?) && !current_page?(root_path) && !current_page?("/rooms/#{params[:id]}") %> 
    <nav class="navbar navbar-default" style="background-color: #89dfd7;"> 
      <div class="container"> 
        <ul class="nav navbar-nav"> 
          <li <% if current_page?(dashboard_path) %> class="active" <% end %> > <%= link_to "ダッシュボード", dashboard_path %></li> 
          <li <% if current_page?(host_calendar_path) %> class="active" <% end %> ><%= link_to "ホスト用カレンダー", host_calendar_path %></li> 
          <li <% if current_page?(revenues_path) %> class="active" <% end %> ><%= link_to "収益", revenues_path %></li> 
          <li <% if current_page?(payment_method_path) %> class="active" <% end %> ><%= link_to "クレジットカード登録", payment_method_path, data: { turbolinks: false} %></li> 
          <li <% if current_page?(payout_method_path) %> class="active" <% end %> ><%= link_to "振り込み口座登録", payout_method_path %></li> 
        </ul> 
      </div> 
    </nav> 
<% end %> 


ナビゲーションバー更新



受注予約の一覧(ホスト用)に詳細な予約情報が出るように更新します。


更新 app\views\reservations\your_reservations.html.erb
 
<div class="row"> 
  <div class="col-md-3"> 
    <ul class="sidebar-list"> 
      <li class="sidebar-item"><%= link_to "受注予約の一覧", your_reservations_path, class: "sidebar-link active" %></li> 
      <li class="sidebar-item"><%= link_to "登録したお部屋の管理", rooms_path, class: "sidebar-link" %></li> 
      <li class="sidebar-item"><%= link_to "お部屋の新規登録", new_room_path, class: "sidebar-link" %></li> 
    </ul> 
  </div> 
  <div class="col-md-9"> 
    <div class="panel panel-default"> 
      <div class="panel-heading"> 
        受注予約の一覧 
      </div> 
      <div class="panel-body"> 
        <% @rooms.each do |room| %> 
            <% room.reservations.each do |reservation| %> 
                <div class="row"> 
                  <div class="col-md-4" style="white-space: nowrap"> 
                    チェックイン :<%= I18n.l(reservation.start_date, format: :full_date) %><br/> 
                    チェックアウト:<%= I18n.l(reservation.end_date, format: :full_date) %><br/> 
                    <br/> 
                    1泊の宿泊料(税込):<%= number_to_currency(reservation.price) %><br/> 
                    合計(税込):<%= number_to_currency(reservation.total) %><br/> 
                    <% if reservation.Waiting? %> 
                      <br/><p style="color: red;">承認待ちです。要確認</p> 
                    <% elsif reservation.Approved? %> 
                      <br/><p style="color: green;">予約を承認しました</p> 
                    <% else  %> 
                      <br/><p style="color: red;">予約を拒否しました</p> 
                    <% end  %> 
                    <div class="form-inline"> 
                      <% if reservation.Waiting? %> 
                          <%= link_to approve_reservation_path(reservation), method: :post do %> <i class="fa fa-thumbs-up fa-lg"></i> <% end %> | 
                          <%= link_to decline_reservation_path(reservation), method: :post do %> <i class="fa fa-thumbs-down fa-lg"></i> <% end %> 
                      <% end %> 
                    </div> 
                  </div> 
                  <div class="col-md-2"> 
                    <%= link_to room_path(reservation.room) do %> 
                        <%= image_tag reservation.room.cover_photo(:thumb) %> 
                    <% end %> 
                  </div> 
                  <div class="col-md-5"> 
                    <%= link_to reservation.room.listing_name, room_path(reservation.room) %><br/><br/> 
                    <span> 
                      <%= link_to user_path(reservation.user) do %> 
                        <%= image_tag reservation.user.gravatar_url, class: "img-circle avatar-small" %>&nbsp; 
                        <%= reservation.user.fullname %> 
                      <% end %> 
                    </span> 
                  </div> 
                  <div class="col-md-3 text-left"> 
                    <br/> 
                    <%= render partial: "reviews/host_form", locals: {reservation: reservation}  if reservation.Approved? %> 
                  </div> 
                </div> 
                <hr/> 
            <% end %> 
        <% end %> 
      </div> 
    </div> 
  </div> 
</div> 


受注予約一覧ページ(ホスト用)の更新







この続きはプロジェクトを購入していただくことで見ることができます。
プロジェクトを購入していただくとこのタスクの内容の全てを読みやすい表示で見ることができます。
プログラムコードが色分けされて見やすくなります。
プログラムコードに行番号が付きます。
本文が色分けされて見やすくなります。
そしてプロジェクトを購入するとこのアプリケーションのフルコードをダウンロードすることができます。

まだレビューはありません。

民泊サイトの構築 Rails5.0

2,000円

民泊サイトを構築します。
ホストは部屋を登録し、ゲストは宿泊予約できます。
ゲストはクレジットカードで支払いをし、ホストには料金の80%が自動で口座に振り込まれます。
Googleマップによる表示、AJAX検索、日付カレンダーによる予約、フルカレンダーによる部屋管理ができます。
リアルタイムメッセージにより連絡がとれます。
予約確認メールの送信も可能。
写真のアップロード機能、アマゾンS3の利用方法も解説。
レビュー機能の実装、電話番号認証の実装方法解説。
HEROKUへのデプロイ方法を解説。
フルコードのダウンロード可能。

タスク数: 136