diff --git a/dolphinscheduler-ui-next/package.json b/dolphinscheduler-ui-next/package.json index 712e76874d..1cb7eba978 100644 --- a/dolphinscheduler-ui-next/package.json +++ b/dolphinscheduler-ui-next/package.json @@ -28,6 +28,15 @@ "@types/qs": "^6.9.7", "@typescript-eslint/eslint-plugin": "^5.6.0", "@typescript-eslint/parser": "^5.6.0", + "@vicons/antd": "^0.11.0", + "@vicons/carbon": "^0.11.0", + "@vicons/fa": "^0.11.0", + "@vicons/fluent": "^0.11.0", + "@vicons/ionicons4": "^0.11.0", + "@vicons/ionicons5": "^0.11.0", + "@vicons/material": "^0.11.0", + "@vicons/tabler": "^0.11.0", + "@vicons/utils": "^0.1.4", "@vitejs/plugin-vue": "^1.10.2", "@vitejs/plugin-vue-jsx": "^1.3.1", "dart-sass": "^1.25.0", diff --git a/dolphinscheduler-ui-next/src/App.tsx b/dolphinscheduler-ui-next/src/App.tsx index 62ceab3d12..3b31730a77 100644 --- a/dolphinscheduler-ui-next/src/App.tsx +++ b/dolphinscheduler-ui-next/src/App.tsx @@ -17,17 +17,18 @@ import { defineComponent, computed } from 'vue' import { NConfigProvider, darkTheme, GlobalThemeOverrides } from 'naive-ui' +import { useAsyncRouteStore } from '@/store/route/route' import { useThemeStore } from '@/store/theme/theme' import themeList from '@/themes' const App = defineComponent({ name: 'App', setup() { + const asyncRouteStore = useAsyncRouteStore() const themeStore = useThemeStore() const currentTheme = computed(() => themeStore.darkTheme ? darkTheme : undefined ) - return { currentTheme, } @@ -42,7 +43,7 @@ const App = defineComponent({ diff --git a/dolphinscheduler-ui-next/src/assets/images/nav-logo.svg b/dolphinscheduler-ui-next/src/assets/images/nav-logo.svg new file mode 100755 index 0000000000..6a2678621f --- /dev/null +++ b/dolphinscheduler-ui-next/src/assets/images/nav-logo.svg @@ -0,0 +1,99 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/dolphinscheduler-ui-next/src/layouts/basic/components/header/index.module.scss b/dolphinscheduler-ui-next/src/layouts/basic/components/header/index.module.scss new file mode 100644 index 0000000000..5778faed18 --- /dev/null +++ b/dolphinscheduler-ui-next/src/layouts/basic/components/header/index.module.scss @@ -0,0 +1,52 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +.header-model { + display: flex; + justify-content: space-between; + align-items: center; + height: 60px; + box-shadow: rgba(0, 0, 0, 0.3) 0px 3px 5px; + position: relative; + width: 100%; + padding: 0px; + margin: 0px; + .nav { + display: flex; + justify-content: space-between; + align-items: center; + width: inherit; + .menu { + margin-left: 0px; + text-align: center; + font-size: 15px; + color: rgb(255, 255, 255); + } + .profile { + width: 135px; + display: flex; + justify-content: space-between; + margin-right: 20px; + text-align: center; + .icon { + margin-right: 5px; + display: inline-flex; + align-items: center; + } + } + } +} diff --git a/dolphinscheduler-ui-next/src/layouts/basic/components/header/index.tsx b/dolphinscheduler-ui-next/src/layouts/basic/components/header/index.tsx new file mode 100644 index 0000000000..5d076eb01f --- /dev/null +++ b/dolphinscheduler-ui-next/src/layouts/basic/components/header/index.tsx @@ -0,0 +1,106 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { defineComponent, ref } from "vue"; + +import styles from "./index.module.scss"; +import { NDropdown, NIcon, NLayoutHeader, NMenu } from "naive-ui"; +import { Logo } from "@/layouts/basic/components/logo"; +import { IosArrowDown } from "@vicons/ionicons4"; +import { UserAlt } from "@vicons/fa"; + +const Header = defineComponent({ + name: "Header", + props: { + inverted: { + type: Boolean, + default: true, + }, + menuOptions: { + type: Array, + default: [], + }, + languageOptions: { + type: Array, + default: [], + }, + profileOptions: { + type: Array, + default: [], + }, + currentMenu: { + type: Object, + }, + defaultMenuKey: { + type: String, + }, + }, + setup(props, context) { + const currentMenuRef = ref({}); + + const handleMenuClick = (key, data) => { + currentMenuRef.value = data; + context.emit("menuClick", data); + }; + + return { handleMenuClick }; + }, + render() { + return ( + + +
+ +
+ + + 中文 + + + + + + + + + + + admin + + + + + +
+
+
+ ); + }, +}); + +export { Header }; diff --git a/dolphinscheduler-ui-next/src/layouts/basic/components/logo/index.module.scss b/dolphinscheduler-ui-next/src/layouts/basic/components/logo/index.module.scss new file mode 100644 index 0000000000..d7891cb72b --- /dev/null +++ b/dolphinscheduler-ui-next/src/layouts/basic/components/logo/index.module.scss @@ -0,0 +1,36 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +.logo { + display: flex; + align-items: center; + justify-content: center; + height: 64px; + line-height: 64px; + overflow: hidden; + white-space: nowrap; + width: 280px; + + img { + width: auto; + height: 46px; + } + + .title { + margin-bottom: 0; + } +} diff --git a/dolphinscheduler-ui-next/src/layouts/basic/components/logo/index.tsx b/dolphinscheduler-ui-next/src/layouts/basic/components/logo/index.tsx new file mode 100644 index 0000000000..bac1fae62e --- /dev/null +++ b/dolphinscheduler-ui-next/src/layouts/basic/components/logo/index.tsx @@ -0,0 +1,38 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { defineComponent, ref } from "vue"; + +import styles from "./index.module.scss"; + +const Logo = defineComponent({ + name: "Logo", + setup() { + const invertedRef = ref(true); + + return { invertedRef }; + }, + render() { + return ( +
+ +
+ ); + }, +}); + +export { Logo }; diff --git a/dolphinscheduler-ui-next/src/layouts/basic/components/sider/index.module.scss b/dolphinscheduler-ui-next/src/layouts/basic/components/sider/index.module.scss new file mode 100644 index 0000000000..9a5d1a3a4e --- /dev/null +++ b/dolphinscheduler-ui-next/src/layouts/basic/components/sider/index.module.scss @@ -0,0 +1,19 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +.sider-model { +} diff --git a/dolphinscheduler-ui-next/src/layouts/basic/components/sider/index.tsx b/dolphinscheduler-ui-next/src/layouts/basic/components/sider/index.tsx new file mode 100644 index 0000000000..93dd0a6d0a --- /dev/null +++ b/dolphinscheduler-ui-next/src/layouts/basic/components/sider/index.tsx @@ -0,0 +1,79 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { defineComponent, ref } from "vue"; +import { NLayoutSider, NMenu } from "naive-ui"; + +const Sider = defineComponent({ + name: "Sider", + props: { + visible: { + type: Boolean, + default: true, + }, + inverted: { + type: Boolean, + default: true, + }, + menuOptions: { + type: Array, + default: [], + }, + currentMenu: { + type: Object, + }, + defaultMenuKey: { + type: String, + }, + }, + setup(props) { + const currentMenuRef = ref({}); + + const handleMenuClick = (key, data) => { + currentMenuRef.value = data; + }; + + return { handleMenuClick }; + }, + render() { + if (this.visible) { + return ( + + + + ); + } else { + return ""; + } + }, +}); + +export { Sider }; diff --git a/dolphinscheduler-ui-next/src/layouts/basic/index.module.scss b/dolphinscheduler-ui-next/src/layouts/basic/index.module.scss new file mode 100644 index 0000000000..e7c05894e6 --- /dev/null +++ b/dolphinscheduler-ui-next/src/layouts/basic/index.module.scss @@ -0,0 +1,54 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +.container { + .header-model { + display: flex; + justify-content: space-between; + align-items: center; + height: 60px; + box-shadow: rgba(0, 0, 0, 0.3) 0px 3px 5px; + position: relative; + width: 100%; + padding: 0px; + margin: 0px; + .nav { + display: flex; + justify-content: space-between; + align-items: center; + width: inherit; + .menu { + margin-left: 0px; + text-align: center; + font-size: 15px; + color: rgb(255, 255, 255); + } + .profile { + width: 135px; + display: flex; + justify-content: space-between; + margin-right: 20px; + text-align: center; + .icon { + margin-right: 5px; + display: inline-flex; + align-items: center; + } + } + } + } +} diff --git a/dolphinscheduler-ui-next/src/layouts/basic/index.tsx b/dolphinscheduler-ui-next/src/layouts/basic/index.tsx new file mode 100644 index 0000000000..444835dab7 --- /dev/null +++ b/dolphinscheduler-ui-next/src/layouts/basic/index.tsx @@ -0,0 +1,234 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { h, defineComponent, ref } from "vue"; +import styles from "./index.module.scss"; +import { useI18n } from "vue-i18n"; +import { + PersonCircleOutline, + LogOutOutline, + FileTrayFullOutline, + Server, + SettingsOutline, +} from "@vicons/ionicons5"; +import { + HomeOutlined, + FolderOutlined, + SafetyCertificateOutlined, + UserOutlined, +} from "@vicons/antd"; +import { Database, Notes, Users } from "@vicons/tabler"; +import { MonitorFilled, AcUnitOutlined } from "@vicons/material"; +import { Flow } from "@vicons/carbon"; +import { Header } from "./components/header"; +import { Sider } from "./components/sider"; +import { NLayout, NLayoutContent, NIcon } from "naive-ui"; + +function renderIcon(icon) { + return () => h(NIcon, null, { default: () => h(icon) }); +} + +const switchLanguageOptions = [ + { + label: "English", + key: "en", + }, + { + label: "中文", + key: "zh", + }, +]; + +const profileOptions = [ + { + label: "用户信息", + key: "profile", + icon: renderIcon(PersonCircleOutline), + }, + { + label: "退出登录", + key: "logout", + icon: renderIcon(LogOutOutline), + }, +]; + +const menuOptions = [ + { + label: "首页", + key: "home", + icon: renderIcon(HomeOutlined), + }, + { + label: "项目管理", + key: "project", + icon: renderIcon(Notes), + children: [ + { + label: "项目", + key: "projects-list", + icon: renderIcon(Notes), + }, + { + label: "工作流监控", + key: "projects-index", + icon: renderIcon(Flow), + }, + ], + }, + { + label: "资源中心", + key: "resources", + icon: renderIcon(FolderOutlined), + children: [ + { + label: "文件管理", + key: "file", + icon: renderIcon(FileTrayFullOutline), + }, + { + label: "创建资源", + key: "resource-file-create", + icon: renderIcon(AcUnitOutlined), + }, + ], + }, + { + label: "数据源中心", + key: "datasource", + icon: renderIcon(Database), + children: [ + { + label: "数据源中心", + key: "datasource-list", + icon: renderIcon(Database), + }, + ], + }, + { + label: "监控中心", + key: "monitor", + icon: renderIcon(MonitorFilled), + children: [ + { + key: "servers-master", + title: "服务管理-Master", + icon: renderIcon(Server), + }, + { + key: "servers-worker", + title: "服务管理-Worker", + icon: renderIcon(SettingsOutline), + }, + ], + }, + { + label: "安全中心", + key: "security", + icon: renderIcon(SafetyCertificateOutlined), + children: [ + { + key: "tenement-manage", + label: "租户管理", + icon: renderIcon(UserOutlined), + }, + { + key: "users-manage", + label: "用户管理", + icon: renderIcon(Users), + }, + ], + }, +]; + +const basic = defineComponent({ + name: "basic", + setup() { + const invertedRef = ref(true); + const hasSiderRef = ref(false); + const defaultMenuKeyRef = ref("home"); + const currentMenuRef = ref({}); + const topMenuOptionsRef = ref([]); + const sideMenuOptionsRef = ref([]); + + const handleTopMenuClick = (data) => { + currentMenuRef.value = data; + generateMenus(); + }; + + const handleSideMenuClick = (key, data) => { + console.log(data); + }; + + const generateMenus = () => { + topMenuOptionsRef.value = []; + sideMenuOptionsRef.value = []; + hasSiderRef.value = false; + menuOptions.forEach((option) => { + topMenuOptionsRef.value.push({ + label: option.label, + key: option.key, + icon: option.icon, + }); + if ( + currentMenuRef.value.key === option.key || + defaultMenuKeyRef.value === option.key + ) { + if (option.hasOwnProperty("children") && option.children) { + sideMenuOptionsRef.value = option.children; + hasSiderRef.value = true; + } + } + }); + }; + generateMenus(); + return { + topMenuOptionsRef, + sideMenuOptionsRef, + invertedRef, + hasSiderRef, + defaultMenuKeyRef, + handleTopMenuClick, + handleSideMenuClick, + }; + }, + render() { + return ( + +
+ + + + + + + + ); + }, +}); + +export default basic; diff --git a/dolphinscheduler-ui-next/src/layouts/content/Content.tsx b/dolphinscheduler-ui-next/src/layouts/content/Content.tsx index 8211f18719..b1daebc9f4 100644 --- a/dolphinscheduler-ui-next/src/layouts/content/Content.tsx +++ b/dolphinscheduler-ui-next/src/layouts/content/Content.tsx @@ -15,11 +15,11 @@ * limitations under the License. */ -import { defineComponent } from 'vue' -import { NLayout, NLayoutContent } from 'naive-ui' +import { defineComponent } from "vue"; +import { NLayout, NLayoutContent } from "naive-ui"; const Content = defineComponent({ - name: 'Content', + name: "Content", render() { return ( @@ -27,8 +27,8 @@ const Content = defineComponent({ - ) + ); }, -}) +}); -export default Content +export default Content; diff --git a/dolphinscheduler-ui-next/src/router/index.ts b/dolphinscheduler-ui-next/src/router/index.ts index ed70ba8957..7aa6948ac2 100644 --- a/dolphinscheduler-ui-next/src/router/index.ts +++ b/dolphinscheduler-ui-next/src/router/index.ts @@ -20,17 +20,17 @@ import { createWebHistory, NavigationGuardNext, RouteLocationNormalized, -} from 'vue-router' -import routes from './routes' +} from "vue-router"; +import routes from "./routes"; // NProgress -import NProgress from 'nprogress' -import 'nprogress/nprogress.css' +import NProgress from "nprogress"; +import "nprogress/nprogress.css"; const router = createRouter({ history: createWebHistory(), routes, -}) +}); /** * Routing to intercept @@ -41,14 +41,14 @@ router.beforeEach( from: RouteLocationNormalized, next: NavigationGuardNext ) => { - NProgress.start() - next() - NProgress.done() + NProgress.start(); + next(); + NProgress.done(); } -) +); router.afterEach(() => { - NProgress.done() -}) + NProgress.done(); +}); -export default router +export default router; diff --git a/dolphinscheduler-ui-next/src/router/routes.ts b/dolphinscheduler-ui-next/src/router/routes.ts index 01535f9b8a..a92bb4d2d6 100644 --- a/dolphinscheduler-ui-next/src/router/routes.ts +++ b/dolphinscheduler-ui-next/src/router/routes.ts @@ -15,44 +15,189 @@ * limitations under the License. */ -import type { RouteRecordRaw } from 'vue-router' -import type { Component } from 'vue' -import utils from '@/utils' +import type { RouteRecordRaw } from "vue-router"; +import type { Component } from "vue"; +import utils from "@/utils"; +import { useI18n } from "vue-i18n"; // All TSX files under the views folder automatically generate mapping relationship -const modules = import.meta.glob('/src/views/**/**.tsx') -const components: { [key: string]: Component } = utils.mapping(modules) +const modules = import.meta.glob("/src/views/**/**.tsx"); +const components: { [key: string]: Component } = utils.mapping(modules); /** * Basic page */ const basePage: RouteRecordRaw[] = [ { - path: '/', - redirect: { name: 'home' }, - component: () => import('@/layouts/content/Content'), + path: "/", + redirect: { name: "home" }, + meta: { title: "首页" }, + component: () => import("@/layouts/basic"), children: [ { - path: '/home', - name: 'home', - component: components['home'], + path: "/home", + name: "home", + component: components["home"], + meta: { + title: "首页", + }, }, ], }, -] +]; + +const projectsPage = [ + { + path: "/projects", + name: "projects", + redirect: { name: "projects-list" }, + meta: { title: "项目管理" }, + component: () => import("@/layouts/basic"), + children: [ + { + path: "/projects/list", + name: "projects-list", + component: components["home"], + meta: { + title: "项目", + }, + }, + { + path: "/projects/:projectCode/index", + name: "projects-index", + component: components["home"], + meta: { + title: "工作流监控", + }, + }, + ], + }, +]; + +const resourcesPage = [ + { + path: "/resource", + name: "resource", + redirect: { name: "file" }, + meta: { title: "资源中心" }, + component: () => import("@/layouts/basic"), + children: [ + { + path: "/resource/file", + name: "file", + component: components["home"], + meta: { + title: "文件管理", + }, + }, + { + path: "/resource/file/create", + name: "resource-file-create", + component: components["home"], + meta: { + title: "创建资源", + }, + }, + ], + }, +]; + +const datasourcePage = [ + { + path: "/datasource", + name: "datasource", + redirect: { name: "datasource-list" }, + meta: { title: "数据源中心" }, + component: () => import("@/layouts/basic"), + children: [ + { + path: "/datasource/list", + name: "datasource-list", + component: components["home"], + meta: { + title: "数据源中心", + }, + }, + ], + }, +]; + +const monitorPage = [ + { + path: "/monitor", + name: "monitor", + meta: { title: "monitor" }, + redirect: { name: "servers-master" }, + component: () => import("@/layouts/basic"), + children: [ + { + path: "/monitor/servers/master", + name: "servers-master", + component: components["home"], + meta: { + title: "服务管理-Master", + }, + }, + { + path: "/monitor/servers/worker", + name: "servers-worker", + component: components["home"], + meta: { + title: "服务管理-Worker", + }, + }, + ], + }, +]; + +const securityPage: RouteRecordRaw[] = [ + { + path: "/security", + name: "security", + meta: { title: "安全中心" }, + redirect: { name: "tenement-manage" }, + component: () => import("@/layouts/basicLayout"), + children: [ + { + path: "/security/tenant", + name: "tenement-manage", + component: components["home"], + meta: { + title: "租户管理", + }, + }, + { + path: "/security/users", + name: "users-manage", + component: components["home"], + meta: { + title: "用户管理", + }, + }, + ], + }, +]; /** * Login page */ const loginPage: RouteRecordRaw[] = [ { - path: '/login', - name: 'login', - component: components['login'], + path: "/login", + name: "login", + component: components["login"], }, -] +]; -const routes: RouteRecordRaw[] = [...basePage, ...loginPage] +const routes: RouteRecordRaw[] = [ + ...basePage, + ...loginPage, + ...projectsPage, + ...resourcesPage, + ...datasourcePage, + ...monitorPage, + ...securityPage, +]; // 重新组织后导出 -export default routes +export default routes; diff --git a/dolphinscheduler-ui-next/src/store/route/route.ts b/dolphinscheduler-ui-next/src/store/route/route.ts new file mode 100644 index 0000000000..5ef26a52e2 --- /dev/null +++ b/dolphinscheduler-ui-next/src/store/route/route.ts @@ -0,0 +1,46 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { toRaw } from "vue"; +import { defineStore } from "pinia"; +import RouteState from "./types"; +import { RouteRecordRaw } from "vue-router"; + +export const useAsyncRouteStore = defineStore({ + id: "route", + state: (): RouteState => ({ + menus: [], + routers: [], + addRouters: [], + }), + getters: { + getMenus(): RouteRecordRaw[] { + return this.menus; + }, + getRouters(): RouteRecordRaw[] { + return toRaw(this.addRouters); + }, + }, + actions: { + setMenus(menus) { + this.menus = menus; + }, + async generateRouters(routes) { + console.log(routes); + }, + }, +}); diff --git a/dolphinscheduler-ui-next/src/store/route/types.ts b/dolphinscheduler-ui-next/src/store/route/types.ts new file mode 100644 index 0000000000..86fbc6a1df --- /dev/null +++ b/dolphinscheduler-ui-next/src/store/route/types.ts @@ -0,0 +1,25 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { RouteRecordRaw } from "vue-router"; + +interface RouteState { + menus: RouteRecordRaw[]; + routers: any[]; + addRouters: any[]; +} + +export default RouteState;