大家好,本系列文章主要是对我参加全栈营JDstore魔改大赛作品「季风 & MONSOON」的复盘。由于本人也是新手,文章中一定有很多幼稚的错误或代码,希望大家帮忙指出,可反馈至我的邮箱kerzzi@outlook.com,我会持续完善本系列。非常感谢。
本系列是在全栈营JDstore教程基础之上进行魔改,本系列第1-11章节为全栈营JDstore教程,请在完成全栈营JDstore教程的基础上进行测试。
目标
完成商品分类功能开发
步骤
Step 0:建立新分支
在终端执行checkout -b story11```。1 2 3 4 5 6 7
| ### Step 1: 安装分页用gem wil_paginate打开Gemfile ```ruby Gemfile gem 'figaro' gem 'rails-erd' gem 'ancestry' + gem 'will_paginate'
|
在终端执行install```。1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77
| 想使用更漂亮的分页效果?请参考下列文章: Mark。 ### Step 2:修改app/controllers/admin/categories_controller.rb 打开app/controllers/admin/categories_controller.rb ```ruby app/controllers/admin/categories_controller.rb class Admin::CategoriesController < Admin::BaseController before_action :find_root_categories, only: [:new, :create, :edit, :update] before_action :find_category, only: [:edit, :update, :destroy] def index if params[:id].blank? #如果id为空,则说明没二级分类 @categories = Category.roots else @category = Category.find(params[:id]) @categories = @category.children #@category.children是ancestry gem自己提供的 end @categories = @categories.page(params[:page] || 1).per_page(params[:per_page] || 10) .order(id: "desc") end def new @category = Category.new end def create @category = Category.new(params.require(:category).permit!) #以哈希类型的属性,必须做一个过滤,防止批量的属性攻击 #permit!意味着与数据库对应的所有的属性都接收,因为这是后台,所以我这样写 #但是这不是一种严格的写法 if @category.save flash[:notice] = "保存成功" redirect_to admin_categories_path else render action: :new end end def edit render action: :new end def update @category.attributes = params.require(:category).permit! if @category.save flash[:notice] = "修改成功" redirect_to admin_categories_path else render action: :new end end def destroy if @category.destroy flash[:notice] = "删除成功" redirect_to admin_categories_path else flash[:notice] = "删除失败" redirect_to :back end end private def find_root_categories @root_categories = Category.roots.order(id: "desc") end def find_category @category = Category.find(params[:id]) end end
|
Step 3:修改category model文件
打开app/models/category.rb,完整代码如下。
app/models/category.rb1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
| class Category < ApplicationRecord before_validation :correct_ancestry validates :title, presence: { message: "名称不能为空" } validates :title, uniqueness: { message: "名称不能重复" } has_ancestry orphan_strategy: :destroy has_many :products, dependent: :destroy private def correct_ancestry self.ancestry = nil if self.ancestry.blank? end end
|
Step 4:实作app/views/admin/categories/index.html.erb
打开app/views/admin/categories/index.html.erb,完整代码如下。
app/views/admin/categories/index.html.erb1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42
| <div> <div class="pull-right"> <%= link_to "新建分类", new_admin_category_path, class: "btn btn-primary" %> </div>
<h1> <% if @category %> 分类:<%= @category.title %>(<%= @categories.total_entries %>) <% else %> 分类(<%= @categories.total_entries %>) <% end %> </h1> </div>
<div> <table class="table table-striped"> <tr> <th>ID</th> <th>名称</th> <th>权重</th> <th></th> </tr> <% @categories.each do |category| %> <tr> <td><%= category.id %></td> <td><%= category.title %></td> <td><%= category.weight %></td> <td align="right"> <%= link_to "编辑", edit_admin_category_path(category) %> <%= link_to "删除", admin_category_path(category), method: :delete, 'data-confirm': "确认删除吗?" %> <% if category.root? %> <%= link_to "查看子分类", admin_categories_path(id: category) %> <% end %> </td> </tr> <% end %> </table> <%= will_paginate @categories %> </div>
|
Step 5:实作app/views/admin/categories/new.html.erb
打开app/views/admin/categories/new.html.erb,完整代码如下。
app/views/admin/categories/new.html.erb1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52
| <div> <h1><%= @category.new_record? ? "新建分类" : "修改分类 ##{params[:id]}" %></h1> </div> <div class="form-body"> <%= form_for @category, url: (@category.new_record? ? admin_categories_path : admin_category_path(@category)), method: (@category.new_record? ? 'post' : 'put'), html: { class: 'form-horizontal' } do |f| %> <% unless @category.errors.blank? %> <div class="alert alert-danger"> <ul class="list-unstyled"> <% @category.errors.messages.values.flatten.each do |error| %> <li><i class="fa fa-exclamation-circle"></i> <%= error %></li> <% end %> </ul> </div> <% end %> <div class="form-group"> <label for="ancestry" class="col-sm-2 control-label">所属分类:</label> <div class="col-sm-5"> <select name="category[ancestry]"> <option></option> <% @root_categories.each do |category| %> <% next if category == @category %> <option value="<%= category.id %>" <%= @category.ancestry == category.id.to_s ? 'selected' : '' %>><%= category.title %></option> <% end %> </select> 为空为一级分类 </div> </div> <div class="form-group"> <label for="title" class="col-sm-2 control-label">名称:*</label> <div class="col-sm-5"> <%= f.text_field :title, class: "form-control" %> </div> </div> <div class="form-group"> <label for="weight" class="col-sm-2 control-label">权重:</label> <div class="col-sm-5"> <%= f.text_field :weight, class: "form-control" %> 数值越大越靠前 </div> </div> <div class="form-group"> <div class="col-sm-offset-2 col-sm-8"> <%= f.submit (@category.new_record? ? "新建分类" : "编辑分类"), class: "btn btn-default" %> </div> </div> <% end %> </div>
|
Step 6:将变更 commit 进去 git 里面。
1 2 3 4 5 6
| git add . git commit -m "完成商品分类功能开发" git push origin story11 git checkout master git merge story11 git push origin master
|
本章详解
努力更新中,上班族请理解。。。。。