无论如何使用Active Admin添加其他级别的菜单?

时间:2013-03-14 02:19:20

标签: ruby-on-rails activeadmin

我正在使用Active Admin并尝试在下拉菜单中添加其他级别。在文档中,我看到我可以使用此代码放置一个级别:

  ActiveAdmin.register Post do
    menu :parent => "Blog"
  end

感谢您的帮助。

编辑:

我想要这样的东西:

Menu 1 ^
Menu 2 > Menu A
         Menu B
Menu 3

3 个答案:

答案 0 :(得分:5)

我解决了这个问题,覆盖了ActiveAdmin的菜单。还需要为新菜单创建一个新的CSS。

通知ActiveAdmin我们将使用标头本身。为此,在文件 config / initializers / active_admin.rb 中添加以下行:

config.view_factory.header = CustomAdminHeader
config.register_stylesheet 'new_menu.css'

创建一个名为CustomAdminHeader的类,该类将包含将覆盖构造菜单的代码。您可以在 app / admin 中创建此类,并将该文件命名为 custom_admin_header.rb 。并添加此代码以创建新菜单:

class CustomAdminHeader < ActiveAdmin::Views::Header
  include Rails.application.routes.url_helpers

  def build(namespace, menu)
    div :id => 'tabs' do
      # Add one item without son.
      ul do
        # Replace route_destination_path for the route you want to follow when you receive the item click.
        li { link_to 'Item without son', route_destination_path }
      end

      # Add one item with one son.
      ul do
        li do
          text_node link_to("Parent with 1 child", "#")
          ul do
            li { link_to 'Son without child', route_destination_path }
            # If you want to add more children, including more LIs here.
          end
        end
      end

      # Adds a menu item with one son and one grandson.
      ul do
        li do
          text_node link_to("Grandmother with 1 child", "#")
          ul do
            li do
              text_node link_to("Parent with 1 child", route_destination_path)
              ul do
                li { link_to 'Grandson without child', route_destination_path }
                # If you want to add more grandchildren, including more LIs here.
              end
            end
          end
        end
      end

    super(namespace, menu)
  end
end

此类的菜单结构将由此类创建,因此不应显示文件夹 app / admin 中包含的类中使用的菜单设置。为此,您需要在所有类中添加以下代码:

menu false

最后,您需要创建一个名为 new_menu.css 的CSS文件,并为新菜单添加CSS。

我在我的博客上发布了这个解决方案:

http://monteirobrena.wordpress.com/2013/05/07/activeadmin-customizacao-do-menu/

我希望它对任何人都有帮助。

答案 1 :(得分:3)

如果您在菜单中的同一个父级下放置多个资源,那么您的下拉菜单将为每个资源提供一个级别。对于以下示例,“博客”选项卡将下拉包含帖子和评论的菜单。要为“博客”下拉菜单添加更多资源,您只需进行menu :parent => "Blog"

即可

发布资源

ActiveAdmin.register Post do
  menu :parent => "Blog"
end

评论资源

ActiveAdmin.register Comment do
  menu :parent => "Blog"
end

答案 2 :(得分:0)

您可以通过一点CSS帮助在ActiveAdmin.setup配置文件中完成此操作。

首先在ActiveAdmin.setup中添加:

config.namespace :admin do |admin|
  admin.build_menu do |menu|
    menu.add id: 'submenu-id', label: proc { 'SubMenu Title' }, parent: 'Blog', if: proc { current_user.superadmin? } do |submenu_item|
      submenu_item.add label: 'Menu A', url: '/admin/menu_a'
      submenu_item.add label: 'Menu B', url: '/admin/menu_b'
      submenu_item.add label: 'Menu C', url: '/admin/menu_c'
    end
  end
end

然后在active_admin.css.scss中添加一些CSS以调整视图。像这样:

#submenu-id {
  ul {
    display: none !important;
    position: absolute !important;
    left: 166px;
    margin-top: -30px !important;
  }

  &:hover ul {
    display: block !important;
  }
}

我确定您会稍微需要适当调整CSS。 您都需要在每个ActiveAdmin.register页面上添加 'menu false'