how to customize dashboard in active admin gem in rails 4
Installation
Active Admin is a Ruby Gem.
gem 'activeadmin'
More accurately, it's a Rails Engine that can be injected into your existing Ruby on Rails application.
Setting up Active Admin
After installing the gem, you need to run the generator. By default we use Devise, and the generator creates an
AdminUser
model. If you want to create a different model (or modify an existing one for use with Devise) you can pass it as an argument. If you want to skip Devise configuration entirely, you can pass --skip-users
.rails g active_admin:install # creates the AdminUser class
rails g active_admin:install User # creates / edits the class for use with Devise
rails g active_admin:install --skip-users # skips Devise install
The generator adds these core files, among others:
app/admin/dashboard.rb
app/assets/javascripts/active_admin.js.coffee
app/assets/stylesheets/active_admin.css.scss
config/initializers/active_admin.rb
Now, migrate your database and start the server:
rake db:migrate
rails server
Visit
http://localhost:3000/admin
and log in as the default user:- User: admin@example.com
- Password: password
Voila! You're on your brand new Active Admin dashboard.
To register an existing model with Active Admin:
rails generate active_admin:resource MyModel
This creates a file at
app/admin/my_model.rb
to set up the UI; refresh your browser to see it.
To update the JS & CSS assets:
rails generate active_admin:assets
You should also sync these files with their counterparts in the AA source code:
Gem compatibility
will_paginate
If you use
will_paginate
in your app, you need to configure an initializer for Kaminari to avoid conflicts.# config/initializers/kaminari.rb
Kaminari.configure do |config|
config.page_method_name = :per_page_kaminari
end
Now explain how to customize active admin dashboard.
1. Go to your app and find out and open it.
app/admin/dashboard.rb
2.Write what you want to display in customize dashboard in you app below like this example.
dashbord.rb
# # Here is an example of a simple dashboard with columns and panels.
columns do
column do
panel "Total No. of Contacts" do
ol do
Contact.all.map do |contact|
li (contact.Name)
end
end
end
end
column do
panel "Total No. of Groups" do
ol do
Group.all.map do |group|
li (group.name)
end
end
end
end
column do
panel "Total No. of Skills" do
ol do
Skill.all.map do |skill|
li (skill.name)
end
end
end
end
# column do
# panel "Info" do
# para "Welcome to ActiveAdmin."
# end
# end
end
columns do
column do
panel "Groups under Contacts" do
para "Welcome to ActiveAdmin."
ol do
Group.all.map do |group|
b li (group.name)
ol id:"#{group.name}", class:"my_hide" do
group.contacts.each do |cont|
li do cont.Name
end
end
end
end
end
end
end
column do
panel "Groups Blocks & Skills under Contacts" do
para "Welcome to ActiveAdmin."
ol do
Group.all.map do |group|
div class: "block" do
b (group.name)
group.skills.each do |skill|
b name:"#{skill.name}_#{group.name}" do
li skill.name
ul id:"#{skill.name}_#{group.name}", class:"my_hide" do
skill.contacts.each do |contact|
li contact.Name
end end
end end
end
end
end
end
end
end
end
Columns do
column do
li do
#Some required code
end
end
end
Comments
Post a Comment