modify some style (#2199)

DataLinkDC · Aug 11, 2023 · ed6b27e · ed6b27e
1 parent 7b38967
commit ed6b27e
Showing 1 changed file with 41 additions and 19 deletions.
diff --git a/dinky-web/src/pages/AuthCenter/Menu/function.tsx b/dinky-web/src/pages/AuthCenter/Menu/function.tsx
@@ -21,6 +21,8 @@ import {SysMenu} from "@/types/RegCenter/data";
 import {searchTreeNode} from "@/utils/function";
 import * as Icons from '@ant-design/icons';
 import * as React from "react";
+import {Space} from "antd";
+import {l} from "@/utils/intl";
 
 /**
  * render icon
@@ -29,9 +31,29 @@ import * as React from "react";
  */
 const renderIcon = (iconName: string) => {
     // @ts-ignore
-    return iconName ? React.createElement(Icons[iconName]): null;
+    return iconName ? React.createElement(Icons[iconName]) : null;
 }
 
+const renderMenuType = (menuYype: string) => {
+    switch (menuYype) {
+        case 'F':
+            return <>{l('menu.type.button')}</>
+        case 'M':
+            return <>{l('menu.type.dir')}</>
+        case 'C':
+            return <>{l('menu.type.menu')}</>
+        default:
+            return null
+    }
+}
+
+const renderTitle = (value: SysMenu) => (<Space>
+        {value.perms && <span style={{color: 'grey'}}>&nbsp;&nbsp;&nbsp;{value.perms}</span>}
+        {value.type && <span style={{color: 'grey'}}>&nbsp;&nbsp;&nbsp;{renderMenuType(value.type)}</span>}
+        {value.note && <span style={{color: 'grey'}}>&nbsp;&nbsp;&nbsp;{value.note}</span>}
+    </Space>
+);
+
 /**
  * build menu tree
  * @param {SysMenu[]} data
@@ -40,7 +62,7 @@ const renderIcon = (iconName: string) => {
  * @returns {any}
  */
 export const buildMenuTree = (data: SysMenu[], searchValue: string = ''): any => data.filter((sysMenu: SysMenu) => (sysMenu.name.toLowerCase().indexOf(searchValue.toLowerCase()) > -1)).map((item: SysMenu) => {
-    // const renderTitle = (value: SysMenu) =>( <>{value.name} {value.perms && <span style={{color: 'grey'}}> ----- {value.perms}</span>}</>)
+
 
     return {
         isLeaf: !item.children || item.children.length === 0,
@@ -51,7 +73,7 @@ export const buildMenuTree = (data: SysMenu[], searchValue: string = ''): any =>
         content: item.note,
         path: item.path,
         value: item.id,
-        title: searchTreeNode(item.name, searchValue),
+        title: <>{searchTreeNode(item.name, searchValue)}{renderTitle(item)}</>,
         fullInfo: item,
         key: item.id,
         children: buildMenuTree(item.children, searchValue),
@@ -67,20 +89,20 @@ export const buildMenuTree = (data: SysMenu[], searchValue: string = ''): any =>
  */
 
 export const buildMenuFormTree = (data: SysMenu[], searchValue: string = '', filterButton = false): any => data.filter((sysMenu: SysMenu) => (sysMenu.name.toLowerCase().indexOf(searchValue.toLowerCase()) > -1)).filter((sysMenu: SysMenu) => (filterButton ? sysMenu.type !== 'F' : false)).map((item: SysMenu) => {
-        // const renderTitle = (value: SysMenu) =>( <>{value.name} {value.perms && <span style={{color: 'grey'}}> ----- {value.perms}</span>}</>)
+    // const renderTitle = (value: SysMenu) =>( <>{value.name} {value.perms && <span style={{color: 'grey'}}> ----- {value.perms}</span>}</>)
 
-        return {
-            isLeaf: !item.children || item.children.length === 0,
-            name: item.name,
-            parentId: item.parentId,
-            label: searchTreeNode(item.name, searchValue),
-            icon: renderIcon(item.icon),//
-            content: item.note,
-            path: item.path,
-            value: item.id,
-            title: searchTreeNode(item.name, searchValue),
-            fullInfo: item,
-            key: item.id,
-            children: buildMenuFormTree(item.children, searchValue, filterButton),
-        }
-    });
+    return {
+        isLeaf: !item.children || item.children.length === 0,
+        name: item.name,
+        parentId: item.parentId,
+        label: searchTreeNode(item.name, searchValue),
+        icon: renderIcon(item.icon),//
+        content: item.note,
+        path: item.path,
+        value: item.id,
+        title: <>{searchTreeNode(item.name, searchValue)}{renderTitle(item)}</>,
+        fullInfo: item,
+        key: item.id,
+        children: buildMenuFormTree(item.children, searchValue, filterButton),
+    }
+});