Giới thiệu Gem Active Admin
Quản lý ứng dụng (application adminstrantion) là 1 trong những yêu cầu chung của hầu hết cái ứng dụng web. Và việc xây dựng nó cũng tốn khá nhiều thời gian và gây nhiều khó khăn cho các lập trình viên. Vì vậy mình xin giới thiệu 1 gem active-admin với rails sẽ giúp cho các bạn tránh khỏi việc tạo ...
Quản lý ứng dụng (application adminstrantion) là 1 trong những yêu cầu chung của hầu hết cái ứng dụng web. Và việc xây dựng nó cũng tốn khá nhiều thời gian và gây nhiều khó khăn cho các lập trình viên. Vì vậy mình xin giới thiệu 1 gem active-admin với rails sẽ giúp cho các bạn tránh khỏi việc tạo giao diện quản trị và quản lý 1 cách tốt nhất.
- Tạo project với rails: rails new demo-active-admin
- Tạo model:
- rails g model Genre name:string
- rails g model Author first_name:string last_name:string
- rails g model Book name:string price:decimal author:references genre:references
- rake db:migrate
- Tạo các quan hệ trong model
#app/models/genre.rb class Genre < ActiveRecord::Base has_many :books end
#app/models/author.rb class Author < ActiveRecord::Base has_many :books end
#app/models/book.rb class Book < ActiveRecord::Base belongs_to :author belongs_to :genre end
- Thêm gem activeadmin trong gemfile and bundle:
- gem 'activeadmin' và gem devise (activeadmin sẽ sử dụng gem devise cho việc authentication)
- bundle
- Generator để cài đặt active admin: rails g active_admin:install Nó sẽ tạo AdminUser model và khởi tạo cấu hình ActiveAdmin. Và nó sẽ sử dụng gem devise cho việc authentication. Nếu bạn đã có AdminUser model thì bạn chạy rails g active_admin:install AdminUser sau đó rake db:migrate
- Chạy server và truy cập http://localhost:3000/admin
Bạn có thể đăng nhập bằng tài khoản đã có sẵn trong file seeds
Username: admin@example.com Password: password
- Sau khi đăng nhập bảng điểu khiển quản trị sẽ hiện ra
vậy đã xong phần cài đặt. giờ mình sẽ customizing views nó để hiểu rõ hơn về activeadmin Vào Book page chúng ta sẽ nhìn thấy bảng hiển thị các atrributes của bảng book và name của 2 bảng quan hệ với nó là Author và Genre được show ra. để hiển thị theo ý muộn các bạn có thể setup trong file : app/admin/book.rb Đầu tiên các bạn sẽ thấy model book được khai báo: ActiveAdmin.register Book Khi khai báo ActiveAdmin.register nameModel thì ActiveAdmin sẽ tạo ra default các view từ table, filler, search và download csv, xml, json và các action: view, edit, delete Giờ đâu chúng ta muốn table book không hiển thị tất cả cái attributes nữa vậy ta có thể custom nó như sau
index do column :name column :author column :genre column :price default_actions end
ActiveAdmin sẽ tự động phát hiện ra quan hệ belongs_to với 2 bảng Book và Genre và sẽ tự động hiển thị name của 2 bảng này ra. Nhưng có 1 vấn đề là bảng Author không có attribute name mà nó sẽ hiển thị 'Author#id' Vậy làm thế nào để activeadmin hiển thị name của author.
# Active Admin makes educated guesses when displaying objects, this is # the list of methods it tries calling in order setting :display_name_methods, [ :display_name, :full_name, :name, :username, :login, :title, :email, :to_s ]
Trong model models/author.rb tạo 1 function
def full_name "#{first_name} #{last_name}" end
Bạn cũng có thể custom 1 số dữ liệu khác trước khi nó hiển thị như price bạn có thể sử dụng number_to_currency
column :price do |product| number_to_currency product.price end
và có thể custom action default như sau
actions defaults: false do |post| item "View", admin_book_path(book) end
Thay đổi tên của cột
column 'New Name', :name
Bên phải màn hình là filter và search Cũng giống như hiển thị. Bạn có thể filter theo attributes nào bạn muốn:
filter :name filter :author filter :genre filter :price
Điều đáng nói là activeadmin sẽ chọn kiểu filter theo type của atttibutes đối với type là string và text thì sẽ là textbox để filter đối với type là boolean thì sẽ là checkbox. Và bạn có thẻ custom nó theo ý mình
filter :author, :as => :check_boxes filter :genre, :as => :check_boxes
- Bạn có thể remove action filter trong file admin/ config.filters = false
- Remove specific filters remove_filter :book, :name
- Thay đôi label filter filter :name, lable: "Book Name"
- Scope a filter's conllection filter :book, collection: -> { Book.all }
- Change String repersentation
filter :book, collection: -> { Book.all.map { |book| [book.name, book.id] } }
- thêm HTML filter :price, as: :number, input_html: { step: 10, min: 0, max: 100 }
Active Admin cho phép bạn download data dưới dạng csv, xml, json Bạn có thể custom nó trong:
csv do column :first_name column :last_name end
Scope cũng là 1 tính năng trong active admin. Để khai báo 1 scope bước đầu chúng ta sẽ khai báo trong model
# models/book.rb class Book < ActiveRecord::Base scope :find_name, -> { where(name: 'Hooked') } end
Sau đó chúng ta có thể gọi
ActiveAdmin.register Book do scope :find_name end
và kết quả chúng ta nhận được là:
Trên đây là những kiến thức cơ bản về Active Admin. Để tìm hiểu và sử dụng linh hoạt cũng như custom về giao diện các bạn có thể tìm hiểu và tham khảo các tài liệu : https://activeadmin.info https://hashrocket.com/blog/posts/customize-activeadmin-index-filters#coerce-the-input-type https://github.com/activeadmin/activeadmin