我需要自定义活动的管理布局,但我该怎么做?
5 回答
活动管理布局实际上并未定义为布局文件,而是以编程方式生成。因此,在布局目录中放置自定义布局实际上不会覆盖默认布局。
但是,您可以在应用程序中对活动的管理布局方法进行猴子补丁或鸭子打孔。
以下将在标题中添加一个特定于 ie 的样式表:
module ActiveAdmin
module Views
module Pages
class Base < Arbre::HTML::Document
alias_method :original_build_active_admin_head, :build_active_admin_head unless method_defined?(:original_build_active_admin_head)
def build_active_admin_head
within @head do
meta :"http-equiv" => "Content-type", :content => "text/html; charset=utf-8"
insert_tag Arbre::HTML::Title, [title, active_admin_application.site_title].join(" | ")
active_admin_application.stylesheets.each do |path|
link :href => stylesheet_path(path), :media => "screen", :rel => "stylesheet", :type => "text/css"
end
active_admin_application.javascripts.each do |path|
script :src => javascript_path(path), :type => "text/javascript"
end
text_node csrf_meta_tag
text_node "<!--[if lt IE 7]>
<link rel=\"stylesheet\" type=\"text/css\" media=\"all\" href=\"admin_ie7.css\ />
<![endif] -->".html_safe
end
end
end
end
end
end
显然是一个丑陋的解决方案。
当在 gem 和 rails 应用程序中定义视图时,会提供在 Rails 应用程序中定义的视图。这是一个逻辑优先级。
因此,如果您需要覆盖所有或部分活动的管理员视图,则必须将它们复制到您的应用程序中并根据需要进行更改。
也许 ActiveAdmin 现在确实提供了一种更好的方法来做到这一点?我不知道。然而,这将是一个针对这种情况的更清洁补丁的示例,在我的示例中,将 webpacker gems javascript_pack_tag 添加到我的管理区域。
module MyApp
module ActiveAdmin
module Views
module Pages
module BaseExtension
def build_active_admin_head
super
within @head do
text_node(javascript_pack_tag('application'))
end
end
end
end
end
end
end
class ActiveAdmin::Views::Pages::Base < Arbre::HTML::Document
prepend MyApp::ActiveAdmin::Views::Pages::BaseExtension
end
(使用 rails 5.1.4)我在这里尝试了两个涉及弄乱 active_admin 库的解决方案,但它们根本不适合我。我在config/initializers/active_admin.rb
. 我在默认布局中添加了少量引导样式。至于链接到样式表、javascript 等,就像将其添加到我的 active_admin.rb 一样简单,根据其中的评论:
# == Register Stylesheets & Javascripts
#
# We recommend using the built in Active Admin layout and loading
# up your own stylesheets / javascripts to customize the look
# and feel.
#
# To load a stylesheet:
# config.register_stylesheet 'my_stylesheet.css'
config.register_stylesheet 'https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css', { integrity: 'sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk', crossorigin: 'anonymous' }
至于编辑生成的布局,我还没有弄清楚,但它至少可以通过 JavaScript 间接完成,并通过在这个文件中包含该 javascipt
config.register_javascript 'active_admin_view_tweaks.js', { defer: true }
我将编辑类属性以使我的页面通过引导程序响应,因此我可能会按照geeksforgeeks 文章之类的内容在加载后使用 JavaScript 编辑页面。
我不知道是否有办法更直接地编辑生成的布局,但这应该适用于某些情况。
您可以通过将以下代码放入config/intializers/active_admin.rb
文件中来覆盖活动的管理页面布局:
module AdminPageLayoutOverride
def build_page(*args)
within super do
render "shared/your_custom_view_partial"
end
end
end
ActiveAdmin::Views::Pages::Base.send :prepend, AdminPageLayoutOverride
在上面的示例中,我在app/views/shared/_your_custom_view_partial.html.erb
location 有一个自定义视图文件,我通过上面的代码将它注入到我所有的活动管理页面中。