后台菜单

中间件：app/middleware/admin_sidebar.js

module.exports = (option, app) => {
  return async (ctx, next) => {
    let menus = [{
      name: "主面板",
      icon: "fe-home",
      url: "/admin",
    }, {
      name: "用户管理",
      icon: "fe-user-plus",
      url: "/admin/user",
    }, {
      name: "直播间管理",
      icon: "fe-document",
      url: "/admin/live",
    }, {
      name: "礼物管理",
      icon: "fe-vector",
      url: "/admin/gift",
    }, {
      name: "订单管理",
      icon: "fe-cart",
      url: "/admin/order",
    }, {
      name: "管理员管理",
      icon: "fe-table",
      url: "/admin/manager",
    }];

    ctx.locals.sidebar = menus.map((item) => {
      if (
        (ctx.request.url === "/admin" && item.url === "/admin") ||
        (ctx.request.url.startsWith(item.url) && ctx.request.url != "/admin") &&
          item.url !== "/admin"
      ) {
        item.active = "active";
      }
      return item;
    });

    await next();
  };
};

配置：config/config.default.js

config.middleware = [
  // ...
  "adminSidebar",
  // ...
];
config.adminSidebar = {
  ignore: [
    "/api",
    "/admin/login",
    "/admin/loginevent",
    "/public",
  ],
};

模板：app/view/admin/layout/ _slider.html

html

<div class="sidebar" id="sidebar">
    <div class="sidebar-inner slimscroll">
        <div id="sidebar-menu" class="sidebar-menu">
            <ul>
                {% for item in ctx.locals.sidebar %}
                <li class="{{ item.active }}">
                    <a href="{{item.url}}"><i class="fe {{item.icon}}"></i> <span>{{item.name}}</span></a>
                </li>
                {% endfor %}
            </ul>
        </div>
    </div>
</div>

后台菜单 ​

后台菜单