Improve the routing (#8176)

dolphinscheduler-ui-next/src/layouts/content/components/sidebar/use-menuClick.ts

@@ -25,9 +25,9 @@ export function useMenuClick() {
   const menuStore = useMenuStore()
 
   const handleMenuClick = (key: string, item: MenuOption) => {
-    // console.log(key, item)
+    console.log(key, item)
-    menuStore.setSideMenuKey(key)
+    menuStore.setSideMenuKey(`${key}`)
-    router.push({ path: `/${menuStore.getMenuKey}/${key}` })
+    router.push({ path: `${key}` })
   }
 
   return {

dolphinscheduler-ui-next/src/layouts/content/index.tsx

@@ -46,14 +46,14 @@ const Content = defineComponent({
     onMounted(() => {
       changeMenuOption(state)
       changeHeaderMenuOptions(state)
-      genSideMenu(state)
+      getSideMenu(state)
       changeUserDropdown(state)
     })
 
     watch(useI18n().locale, () => {
       changeMenuOption(state)
       changeHeaderMenuOptions(state)
-      genSideMenu(state)
+      getSideMenu(state)
       changeUserDropdown(state)
     })
 
@@ -61,12 +61,11 @@ const Content = defineComponent({
       () => route.path,
       (path) => {
         state.isShowSide = menuStore.getShowSideStatus
-        const regex = new RegExp('[^/]+$', 'g')
+        menuStore.setSideMenuKey(path)
-        menuStore.setSideMenuKey((path.match(regex) as RegExpMatchArray)[0])
       }
     )
 
-    const genSideMenu = (state: any) => {
+    const getSideMenu = (state: any) => {
       const key = menuStore.getMenuKey
       state.sideMenuOptions =
         state.menuOptions.filter((menu: { key: string }) => menu.key === key)[0]
@@ -76,7 +75,7 @@ const Content = defineComponent({
 
     const getSideMenuOptions = (item: any) => {
       menuStore.setMenuKey(item.key)
-      genSideMenu(state)
+      getSideMenu(state)
     }
 
     return {

dolphinscheduler-ui-next/src/layouts/content/use-dataList.ts

@@ -90,7 +90,7 @@ export function useDataList() {
         children: [
           {
             label: t('menu.project_overview'),
-            key: 'projects-overview',
+            key: `/projects/${menuStore.getProjectCode}`,
             icon: renderIcon(FundProjectionScreenOutlined)
           },
           {
@@ -100,15 +100,15 @@ export function useDataList() {
             children: [
               {
                 label: t('menu.workflow_relation'),
-                key: 'workflow-relation'
+                key: `/projects/workflow-relation`
               },
               {
                 label: t('menu.workflow_definition'),
-                key: 'workflow-definition'
+                key: `/projects/workflow-definition`
               },
               {
                 label: t('menu.workflow_instance'),
-                key: 'workflow-instance'
+                key: `/projects/workflow-instance`
               }
             ]
           },
@@ -119,11 +119,11 @@ export function useDataList() {
             children: [
               {
                 label: t('menu.task_definition'),
-                key: 'task-definition'
+                key: `/projects/task-definition`
               },
               {
                 label: t('menu.task_instance'),
-                key: 'task-instance'
+                key: `/projects/task-instance`
               }
             ]
           }
@@ -137,7 +137,7 @@ export function useDataList() {
         children: [
           {
             label: t('menu.file_manage'),
-            key: 'file-manage',
+            key: `/resource/file-manage`,
             icon: renderIcon(FileSearchOutlined)
           },
           {
@@ -147,11 +147,11 @@ export function useDataList() {
             children: [
               {
                 label: t('menu.resource_manage'),
-                key: 'resource-manage'
+                key: `/resource/resource-manage`
               },
               {
                 label: t('menu.function_manage'),
-                key: 'function-manage'
+                key: `/resource/function-manage`
               }
             ]
           },
@@ -162,7 +162,7 @@ export function useDataList() {
             children: [
               {
                 label: t('menu.task_group_option'),
-                key: 'task-group-option'
+                key: `/resource/task-group-option`
               }
             ]
           }
@@ -188,15 +188,15 @@ export function useDataList() {
             children: [
               {
                 label: t('menu.master'),
-                key: 'master'
+                key: `/monitor/master`
               },
               {
                 label: t('menu.worker'),
-                key: 'worker'
+                key: `/monitor/worker`
               },
               {
                 label: t('menu.db'),
-                key: 'db'
+                key: `/monitor/db`
               }
             ]
           },
@@ -207,7 +207,7 @@ export function useDataList() {
             children: [
               {
                 label: t('menu.statistics'),
-                key: 'statistics'
+                key: `/monitor/statistics`
               }
             ]
           }
@@ -221,42 +221,42 @@ export function useDataList() {
         children: [
           {
             label: t('menu.tenant_manage'),
-            key: 'tenant-manage',
+            key: `/security/tenant-manage`,
             icon: renderIcon(UsergroupAddOutlined)
           },
           {
             label: t('menu.user_manage'),
-            key: 'user-manage',
+            key: `/security/user-manage`,
             icon: renderIcon(UserAddOutlined)
           },
           {
             label: t('menu.alarm_group_manage'),
-            key: 'alarm-group-manage',
+            key: `/security/alarm-group-manage`,
             icon: renderIcon(WarningOutlined)
           },
           {
             label: t('menu.alarm_instance_manage'),
-            key: 'alarm-instance-manage',
+            key: `/security/alarm-instance-manage`,
             icon: renderIcon(InfoCircleOutlined)
           },
           {
             label: t('menu.worker_group_manage'),
-            key: 'worker-group-manage',
+            key: `/security/worker-group-manage`,
             icon: renderIcon(ControlOutlined)
           },
           {
             label: t('menu.yarn_queue_manage'),
-            key: 'yarn-queue-manage',
+            key: `/security/yarn-queue-manage`,
             icon: renderIcon(SlackOutlined)
           },
           {
             label: t('menu.environment_manage'),
-            key: 'environment-manage',
+            key: `/security/environment-manage`,
             icon: renderIcon(EnvironmentOutlined)
           },
           {
             label: t('menu.token_manage'),
-            key: 'token-manage',
+            key: `/security/token-manage`,
             icon: renderIcon(SafetyOutlined)
           }
         ]