Fix the routing problem of project management module (#8236)

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

@@ -40,7 +40,7 @@ const Content = defineComponent({
       changeHeaderMenuOptions,
       changeUserDropdown
     } = useDataList()
-    const sideKey = ref()
+    const sideKeyRef = ref()
 
     locale.value = localesStore.getLocales
 
@@ -58,15 +58,6 @@ const Content = defineComponent({
       changeUserDropdown(state)
     })
 
-    watch(
-      () => route.path,
-      () => {
-        state.isShowSide = menuStore.getShowSideStatus
-        sideKey.value = route.matched[1]?.path
-      },
-      { immediate: true }
-    )
-
     const getSideMenu = (state: any) => {
       const key = menuStore.getMenuKey
       state.sideMenuOptions =
@@ -80,12 +71,29 @@ const Content = defineComponent({
       getSideMenu(state)
     }
 
+    watch(
+      () => route.path,
+      () => {
+        state.isShowSide = menuStore.getShowSideStatus
+        route.matched[1].path.includes(':projectCode')
+        if (route.matched[1].path === '/projects/:projectCode') {
+          changeMenuOption(state)
+          getSideMenu(state)
+        }
+        sideKeyRef.value = 
+          route.matched[1].path.includes(':projectCode')
+           ? route.matched[1].path.replace(':projectCode', menuStore.getProjectCode)
+           : route.matched[1].path
+      },
+      {immediate: true}
+    )
+
     return {
       ...toRefs(state),
       menuStore,
       changeMenuOption,
       getSideMenuOptions,
-      sideKey
+      sideKeyRef
     }
   },
   render() {
@@ -103,7 +111,7 @@ const Content = defineComponent({
           {this.isShowSide && (
             <SideBar
               sideMenuOptions={this.sideMenuOptions}
-              sideKey={this.sideKey}
+              sideKey={this.sideKeyRef}
             />
           )}
           <NLayoutContent native-scrollbar={false} style='padding: 16px 22px'>

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

@@ -100,30 +100,30 @@ export function useDataList() {
             children: [
               {
                 label: t('menu.workflow_relation'),
-                key: `/projects/workflow-relation`
+                key: `/projects/${menuStore.getProjectCode}/workflow/relation`
               },
               {
                 label: t('menu.workflow_definition'),
-                key: `/projects/workflow-definition`
+                key: `/projects/${menuStore.getProjectCode}/workflow/definitions`
               },
               {
                 label: t('menu.workflow_instance'),
-                key: `/projects/workflow-instance`
+                key: `/projects/${menuStore.getProjectCode}/workflow/instances`
               }
             ]
           },
           {
             label: t('menu.task'),
-            key: 'workflow',
+            key: 'task',
             icon: renderIcon(SettingOutlined),
             children: [
               {
                 label: t('menu.task_definition'),
-                key: `/projects/task-definition`
+                key: `/projects/${menuStore.getProjectCode}/task/definitions`
               },
               {
                 label: t('menu.task_instance'),
-                key: `/projects/task-instance`
+                key: `/projects/${menuStore.getProjectCode}/task/instances`
               }
             ]
           }

dolphinscheduler-ui-next/src/router/modules/projects.ts

@@ -29,10 +29,11 @@ export default {
     title: '项目管理',
     showSide: false
   },
+  redirect: { name: 'projects-list' },
   component: () => import('@/layouts/content'),
   children: [
     {
-      path: '',
+      path: '/projects/list',
       name: 'projects-list',
       component: components['projects-list'],
       meta: {