Step.09 開始修scaffold - Azraeil/JCcart_Note GitHub Wiki

_form

fix app/views/dashboard/admin/items/_form.html.erb，只留下

<div class="actions">
  <%= f.submit %>
</div>

edit

fix app/views/dashboard/admin/items/edit.html.erb

完整code

<h1>Editing Item</h1>

<%= form_for @item, dashboard_admin_item_path, method: :patch  do |f| %>
  <%= render 'form' %>
<% end %>

<%= link_to 'Show', @item %> |
<%= link_to 'Back', items_path %>

先改成這樣，但是他的route是錯的

<h1>Editing Item</h1>

<%= form_for @item  do |f| %>
  <%= render 'form' %>
<% end %>

<%= link_to 'Show', @item %> |
<%= link_to 'Back', items_path %>

我們rake routes，一樣看Controller#Action

dashboard_admin_items GET    /dashboard/admin/items(.:format)             dashboard/admin/items#index
                      POST   /dashboard/admin/items(.:format)             dashboard/admin/items#create
new_dashboard_admin_item GET    /dashboard/admin/items/new(.:format)         dashboard/admin/items#new
edit_dashboard_admin_item GET    /dashboard/admin/items/:id/edit(.:format)    dashboard/admin/items#edit
 dashboard_admin_item GET    /dashboard/admin/items/:id(.:format)         dashboard/admin/items#show
                      PATCH  /dashboard/admin/items/:id(.:format)         dashboard/admin/items#update
                      PUT    /dashboard/admin/items/:id(.:format)         dashboard/admin/items#update
                      DELETE /dashboard/admin/items/:id(.:format)         dashboard/admin/items#destroy

我們在edit頁面，送出表單後會透過HTML動詞Patch來update資料，所以我們要找dashboard/admin/items#update。我們會看到update沒有Prefix可以用，我們就找他的上面一個，也就是dashboard_admin_item因為查看URI Pattern他們都是在同一層，就能把form_for改成

<%= form_for @item, dashboard_admin_item_path, method: :patch  do |f| %>

new

fix app/views/dashboard/admin/items/new.html.erb

完整code

<h1>New Item</h1>

<%= form_for @item, dashboard_admin_items_path, method: :post  do |f| %>
  名稱： <%= f.text_field :name %><br>
  價格： <%= f.number_field :price %>
  <button type="submit" >送出</button>
<% end %>

我們一樣是要先看route，我們現在在new.html.erb按下submit後會透過HTML動詞POST來create一筆資料，所以我們要找dashboard/admin/items#create。找到後發現沒有Prefix，所以找上面一個，找到dashboard_admin_items

JC在此手刻了表單內容。

由於原本用scaffold生成的link_to "Back"他的路由是錯的，所以就先砍掉。

fix edit

fix app/views/dashboard/admin/items/edit.html.erb

<h1>Editing Item</h1>

<%= form_for @item, dashboard_admin_item_path, method: :patch  do |f| %>
  名稱： <%= f.text_field :name %><br>
  價格： <%= f.number_field :price %>
  <button type="submit" >送出</button>
<% end %>

由於link_to 'Show'、link_to 'Back'都是錯的，所以砍掉，表單內容改成先前手刻的

由於都沒用到_form.html.erb所以我們就去把他砍掉

delete app/views/dashboard/admin/items/_form.html.erb

fix index

fix app/views/dashboard/admin/items/index.html.erb 改成

<p id="notice"><%= notice %></p>

<h1>產品列表</h1>

<table>
  <thead>
    <tr>
      <th>id</th>
      <th>名稱</th>
      <th>價格</th>
      <th>管理</th>
    </tr>
  </thead>

  <tbody>
    <% @items.each do |item| %>
      <tr>
        <td><%= item.id %></td>
        <td><%= item.name %></td>
        <td><%= item.price %></td>
        <td>
          <%= link_to '編輯', edit_item_path(item) %>
          <%= link_to '刪除', item, method: :delete, data: { confirm: '你確定嗎?' } %>
        </td>
      </tr>
    <% end %>
  </tbody>
</table>

<br>

<%= link_to 'New Item', new_dashboard_admin_item_path %>

最後面的<%= link_to 'New Item', new_item_path %>他的路由也是錯的，由於我們要建立一個新的item，所以我們rake routes去找dashboard/admin/items#new相對應的Prefix，也就是new_dashboard_admin_item而他是透過Html Verb Get，由於這邊是由scaffold生成的，所以我們可以不用給HTML Verb

建立dashboard與admin的layout

我們透過在iTerm下指令的方式複製application.html.erb然後再去改它

jccart/app/views/layouts

ls
>>  application.html.erb

cp application.html.erb dashboard.html.erb
cp application.html.erb admin.html.erb

ls
>> admin.html.erb		application.html.erb	dashboard.html.erb

fix application.html.erb

fix app/views/layouts/application.html.erb

<body>

<h1>對外頁面:public</h1>

<% if current_user %>

  ...
  ...
  ...
</body>

這麼做的好處是，美工就能對這頁做美化

fix dashboard.html.erb

fix app/views/layouts/dashboard.html.erb

完整code

<!DOCTYPE html>
<html>
<head>
  <title>JCcart</title>
  <%= stylesheet_link_tag    'application', media: 'all' %>
  <%= javascript_include_tag 'application' %>
  <%= csrf_meta_tags %>
</head>
<body>

<h1>使用者後台: dashboard</h1>

Hi! <%= current_user.email %>, <%= link_to "登出", destroy_user_session_path, method: "delete" %>

<%= will_paginate @paginate if @paginate %>

<hr>

<%= yield %>

<hr>

<%= will_paginate @paginate if @paginate %>
</body>
</html>

由於我們強制要登入，所以一定會有current_user可以用，所以delete current_user判斷式

fix admin.html.erb

fix app/views/layouts/admin.html.erb

<!DOCTYPE html>
<html>
<head>
  <title>JCcart</title>
  <%= stylesheet_link_tag    'application', media: 'all' %>
  <%= javascript_include_tag 'application' %>
  <%= csrf_meta_tags %>
</head>
<body>

<h1>後台頁面：admin</h1>

Hi! <%= current_manager.email %>, <%= link_to "登出", destroy_manager_session_path, method: "delete" %>

<hr>

<ul>
  <li><%= link_to "商品管理", dashboard_admin_items_path %></li>
</ul>

<%= will_paginate @paginate if @paginate %>

<hr>

<%= yield %>

<hr>

<%= will_paginate @paginate if @paginate %>
</body>
</html>

要注意：我們現在用的是管理者，所以路由要從user改成manager，current_user要改成current_manager

再來是link_to "商品管理"。我們要先看到全部商品，然後才能做編輯。為了要先看到全部商品，所以我們要去找iitems#index，所以我們要去路由找dashboard/admin/items#index，他的Prefix是dashboard_admin_items，這邊一樣是由scaffold生成的，所以不用給HTML Verb

測試剛剛打的頁面是否都能work

頁面：localhost:3000

去localhost:3000測試，需要先rake db:migrate，然後發現噴了。這是由於scaffold又幫我們建了20160907072602_create_items.rb與20160907073156_create_cates.rb，但是我們先前已經見過這兩個table了，所以我們下指令刪除它

jccart db/migrate

rm 20160907072602_create_items.rb
rm 20160907073156_create_cates.rb

然後我們再重整localhost:3000的頁面，就能順利work了。

頁面：localhost:3000/dashboard/admin/items

測試時localhost:3000/dashboard/admin/items，會發現我們被轉到localhost:3000/managers/sign_in，要我們登入manager

我們剛剛manager的帳號密碼

帳號：[email protected] 密碼：werwerwer

進去後會發現，我們controller沒有打

fix admin/items_controller

fix app/controllers/dashboard/admin/items_controller.rb

class Dashboard::Admin::ItemsController < Dashboard::Admin::AdminController
  def index
    @items = @paginate = Item.paginate(:page => params[:page])
  end
end

然後重整頁面，就能順利進入localhost:3000/dashboard/admin/items

fix admin_controller.rb

成功後會發現h1tag寫得是對外頁面：public，是因為我們少一個語句在controller內

fix app/controllers/dashboard/admin/admin_controller.rb

class Dashboard::Admin::AdminController < ApplicationController
  before_action :authenticate_manager!
  layout 'admin'
end

當我們在 Dashboard::Admin::AdminController寫上layout 'admin'後，所有繼承他的controller，自動變成後台的頁面。

⚠️ **GitHub.com Fallback** ⚠️