[shenyu-dashboard] branch master updated: feat: support custom dynamic menu (#270)

[de...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

dengliming pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/shenyu-dashboard.git


The following commit(s) were added to refs/heads/master by this push:
     new df455255 feat: support custom dynamic menu (#270)
df455255 is described below

commit df455255be66b5e2f9a0df1aee03dc87f17ce1b4
Author: tomsun28 <to...@outlook.com>
AuthorDate: Sat Feb 18 19:21:38 2023 +0800

    feat: support custom dynamic menu (#270)
    
    * feat: support custom dynamic menu
    
    * update open extern link target value '_blank'
---
 src/components/SiderMenu/SiderMenu.js |  5 ++++-
 src/layouts/BasicLayout.js            | 33 +++++++++++++++++++++++++++++++--
 2 files changed, 35 insertions(+), 3 deletions(-)

diff --git a/src/components/SiderMenu/SiderMenu.js b/src/components/SiderMenu/SiderMenu.js
index 7880c1be..7827934e 100644
--- a/src/components/SiderMenu/SiderMenu.js
+++ b/src/components/SiderMenu/SiderMenu.js
@@ -130,9 +130,12 @@ export default class SiderMenu extends PureComponent {
   getMenuItemPath = item => {
     const itemPath = this.conversionPath(item.path);
     const icon = getIcon(item.icon);
-    const { target, name } = item;
+    let { target, name } = item;
     // Is it a http link
     if (/^https?:\/\//.test(itemPath)) {
+      if (target === undefined) {
+        target = '_blank';
+      }
       return (
         <a href={itemPath} target={target}>
           {icon}
diff --git a/src/layouts/BasicLayout.js b/src/layouts/BasicLayout.js
index 01fec43d..31aa23db 100644
--- a/src/layouts/BasicLayout.js
+++ b/src/layouts/BasicLayout.js
@@ -32,6 +32,7 @@ import AuthRoute, {checkMenuAuth, getAuthMenus} from "../utils/AuthRoute";
 import {getMenuData} from "../common/menu";
 import logo from "../assets/logo.svg";
 import TitleLogo from "../assets/TitleLogo.svg";
+import {getIntlContent} from "../utils/IntlUtils";
 
 const MyContext = React.createContext();
 
@@ -96,10 +97,11 @@ const query = {
   }
 };
 
-@connect(({ global, loading }) => ({
+@connect(({ global, resource, loading }) => ({
   plugins: global.plugins,
+  menuTree: resource.menuTree,
   permissions: global.permissions,
-  loading: loading.effects["global/fetchPlugins"]
+  loading: loading.effects["resource/fetchMenuTree"] || loading.effects["global/fetchPlugins"]
 }))
 class BasicLayout extends React.PureComponent {
   static childContextTypes = {
@@ -137,6 +139,9 @@ class BasicLayout extends React.PureComponent {
     dispatch({
       type: "global/fetchPlatform"
     });
+    dispatch({
+      type: "resource/fetchMenuTree"
+    })
     dispatch({
       type: "global/fetchPlugins",
       payload: {
@@ -218,12 +223,36 @@ class BasicLayout extends React.PureComponent {
       match,
       location,
       plugins,
+      menuTree,
       permissions,
       dispatch
     } = this.props;
     const { localeName, pluginsLoaded } = this.state;
     const bashRedirect = this.getBaseRedirect();
     let menus = getMenuData();
+    if (menuTree.length > 0) {
+      menus = menus.slice(0, 1);
+      menuTree.forEach(item => {
+        if (item.name !== 'plug') {
+          let title = getIntlContent(item.meta.title);
+          menus.push({
+            name : title === '' ? item.meta.title : title,
+            icon : item.meta.icon,
+            path : item.url,
+            locale : item.meta.title,
+            children: item.children.map(child => {
+              let childTitle = getIntlContent(child.meta.title);
+              return {
+                name : childTitle === '' ? child.meta.title : childTitle,
+                icon : child.meta.icon,
+                path : child.url,
+                locale : child.meta.title,
+              };
+            })
+          });
+        }
+      });
+    }
 
     const menuMap = {};
     plugins.forEach(item => {