4-2 STORY 1 - 上架后臺(tái) CRUD
目標(biāo)
使用者必須要是 admin 才能登入 http://localhost:3000/admin/products
商品欄位必須要有 title, description, quantity, price
admin 后臺(tái) products 完整的 CRUD
Step 0:
git checkout -b story1
Step 1: 建立 controller admin/products
rails g controller admin::products
Step 2: 設(shè)定 admin/products 的 routes
config/routes.rb
Rails.application.routes.draw do
+ namespace :admin do
+ resources :products
+ end...
(略)
end
Step 3: 建立 model product
rails g model product title:string description:text quantity:integer price:integer
rake db:migrate
Step 4: 實(shí)作后臺(tái)新增商品
app/controllers/admin/products_controller.rb
class Admin::ProductsController < ApplicationController
def new
@product = Product.new
end
def create
@product = Product.new(product_params)
if @product.save
redirect_to admin_products_path
else
render :new
end
end
private
def product_params
params.require(:product).permit(:title, :description, :quantity, :price)
end
end
Step 5: 新增商品頁(yè)面
touch app/views/admin/products/new.html.erb
app/views/admin/products/new.html.erb
<h2> New Product </h2>
<%= simple_form_for [:admin, @product] do |f| %>
<div class="group">
<%= f.input :title %>
</div>
<div class="group">
<%= f.input :description %>
</div>
<div class="group">
<%= f.input :quantity %>
</div>
<div class="group">
<%= f.input :price %>
</div>
<%= f.submit "Submit", data: { disable_with: "Submitting..." } %>
<% end %>
http://localhost:3000/admin/products/new
新增幾個(gè) product 試試看湾宙。
Step 6: 實(shí)作后臺(tái)index action
app/controllers/admin/products_contoller.rb
class Admin::ProductsController < ApplicationController
+ def index
+ @products = Product.all
+ end
def new
@product = Product.new
end
...(略)
end
Step 7: 新增index頁(yè)面
touch app/views/admin/products/index.html.erb
app/views/admin/products/index.html.erb
<ul>
<% @products.each do |product| %>
<li> <%= link_to(product.title, admin_product_path(product)) %> </li>
<% end %>
</ul>
新增商品后可以看到新增的商品頁(yè)面
http://localhost:3000/admin/products
Step 8: 實(shí)作后臺(tái)商品修改
修改 admin/products_controller.rb
app/controllers/admin/products_controller.rb
...(略)
def new
@product = Product.new
end
+ def edit
+ @product = Product.find(params[:id])
+ end
+ def update
+ @product = Product.find(params[:id])
+ if @product.update(product_params)
+ redirect_to admin_products_path
+ else
+ render :edit
+ end
+ end
def create
@product = Product.new(product_params)
...(略)
Step 9: 新增修改頁(yè)面
touch app/views/admin/products/edit.html.erb
app/views/admin/products/edit.html.erb
<h2> Edit Product </h2>
<%= simple_form_for [:admin, @product] do |f| %>
<div class="group">
<%= f.input :title %>
</div>
<div class="group">
<%= f.input :description %>
</div>
<div class="group">
<%= f.input :quantity %>
</div>
<div class="group">
<%= f.input :price %>
</div>
<%= f.submit "Submit", data: { disable_with: "Submitting..." } %>
<% end %>
測(cè)試看看http://localhost:3000/admin/products/1/edit(/product/XXX/edit 若有多筆資料, XXX可以替換為其他數(shù)字)
Step 10: git 存檔
git add .
git commit -m "implement backend CRUD"
