This is an automated email from the ASF dual-hosted git repository.
zhongjiajie pushed a commit to branch dev
in repository https://gitbox.apache.org/repos/asf/incubator-seatunnel.git
The following commit(s) were added to refs/heads/dev by this push:
new 8e60ac270 [Feat][UI] Add routes configuration. (#2177)
8e60ac270 is described below
commit 8e60ac2704a46dfed5cae5e4a6735757761f5c87
Author: songjianet <[email protected]>
AuthorDate: Thu Jul 14 19:14:35 2022 +0800
[Feat][UI] Add routes configuration. (#2177)
---
seatunnel-ui/src/App.tsx | 40 +++++++++++++++++----
seatunnel-ui/src/main.ts | 4 ++-
seatunnel-ui/src/{App.tsx => router/index.ts} | 32 ++++++++---------
seatunnel-ui/src/{App.tsx => router/routes.ts} | 35 ++++++++++--------
seatunnel-ui/src/{App.tsx => utils/index.ts} | 23 +++---------
seatunnel-ui/src/{App.tsx => utils/mapping.ts} | 41 +++++++++++-----------
.../src/{App.tsx => views/login/index.tsx} | 14 +++-----
7 files changed, 103 insertions(+), 86 deletions(-)
diff --git a/seatunnel-ui/src/App.tsx b/seatunnel-ui/src/App.tsx
index 7ceca19d9..6a5c8cefb 100644
--- a/seatunnel-ui/src/App.tsx
+++ b/seatunnel-ui/src/App.tsx
@@ -15,21 +15,47 @@
* limitations under the License.
*/
-import { defineComponent } from 'vue'
-import { NButton } from 'naive-ui'
-import { useI18n } from 'vue-i18n'
+import { defineComponent, computed } from 'vue'
+import {
+ NConfigProvider,
+ darkTheme,
+ dateZhCN,
+ dateEnUS,
+ zhCN,
+ enUS
+} from 'naive-ui'
+import { useThemeStore } from '@/store/theme'
+import { useLocalesStore } from '@/store/locale'
+import themeList from '@/themes'
+import type { GlobalThemeOverrides } from 'naive-ui'
const App = defineComponent({
setup() {
- const { t } = useI18n()
+ const themeStore = useThemeStore()
+ const currentTheme = computed(() =>
+ themeStore.darkTheme ? darkTheme : undefined
+ )
+ const localesStore = useLocalesStore()
- return { t }
+ return {
+ currentTheme,
+ localesStore
+ }
},
render() {
- const { t } = this
+ const themeOverrides: GlobalThemeOverrides =
+ themeList[this.currentTheme ? 'dark' : 'light']
return (
- <NButton>{t('test.test')}</NButton>
+ <NConfigProvider
+ theme={this.currentTheme}
+ theme-overrides={themeOverrides}
+ date-locale={
+ String(this.localesStore.getLocales) === 'zh_CN' ? dateZhCN :
dateEnUS
+ }
+ locale={String(this.localesStore.getLocales) === 'zh_CN' ? zhCN :
enUS}>
+ <router-view />
+ </NConfigProvider>
)
}
})
diff --git a/seatunnel-ui/src/main.ts b/seatunnel-ui/src/main.ts
index f5163bb6a..25683a5a2 100644
--- a/seatunnel-ui/src/main.ts
+++ b/seatunnel-ui/src/main.ts
@@ -16,16 +16,18 @@
*/
import { createApp } from 'vue'
-import App from './App'
import { createPinia } from 'pinia'
+import App from './App'
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
import i18n from '@/locales'
+import router from './router'
const app = createApp(App)
const pinia = createPinia()
pinia.use(piniaPluginPersistedstate)
+app.use(router)
app.use(pinia)
app.use(i18n)
app.mount('#app')
\ No newline at end of file
diff --git a/seatunnel-ui/src/App.tsx b/seatunnel-ui/src/router/index.ts
similarity index 71%
copy from seatunnel-ui/src/App.tsx
copy to seatunnel-ui/src/router/index.ts
index 7ceca19d9..a46d29b3b 100644
--- a/seatunnel-ui/src/App.tsx
+++ b/seatunnel-ui/src/router/index.ts
@@ -15,23 +15,23 @@
* limitations under the License.
*/
-import { defineComponent } from 'vue'
-import { NButton } from 'naive-ui'
-import { useI18n } from 'vue-i18n'
+import {
+ createRouter,
+ createWebHistory
+} from 'vue-router'
+import routes from './routes'
+import NProgress from 'nprogress'
+import 'nprogress/nprogress.css'
-const App = defineComponent({
- setup() {
- const { t } = useI18n()
-
- return { t }
- },
- render() {
- const { t } = this
+const router = createRouter({
+ history: createWebHistory(
+ '/'
+ ),
+ routes
+})
- return (
- <NButton>{t('test.test')}</NButton>
- )
- }
+router.afterEach(() => {
+ NProgress.done()
})
-export default App
\ No newline at end of file
+export default router
\ No newline at end of file
diff --git a/seatunnel-ui/src/App.tsx b/seatunnel-ui/src/router/routes.ts
similarity index 60%
copy from seatunnel-ui/src/App.tsx
copy to seatunnel-ui/src/router/routes.ts
index 7ceca19d9..1a62f7db8 100644
--- a/seatunnel-ui/src/App.tsx
+++ b/seatunnel-ui/src/router/routes.ts
@@ -15,23 +15,28 @@
* limitations under the License.
*/
-import { defineComponent } from 'vue'
-import { NButton } from 'naive-ui'
-import { useI18n } from 'vue-i18n'
+import utils from '@/utils'
+import type { RouteRecordRaw } from 'vue-router'
+import type { Component } from 'vue'
-const App = defineComponent({
- setup() {
- const { t } = useI18n()
+const modules = import.meta.glob('/src/views/**/**.tsx')
+const components: { [key: string]: Component } = utils.mapping(modules)
- return { t }
- },
- render() {
- const { t } = this
+const basePage: RouteRecordRaw[] = [
- return (
- <NButton>{t('test.test')}</NButton>
- )
+]
+
+const loginPage: RouteRecordRaw[] = [
+ {
+ path: '/login',
+ name: 'login',
+ component: components['login'],
+ meta: {
+ auth: []
+ }
}
-})
+]
+
+const routes: RouteRecordRaw[] = [...basePage, ...loginPage]
-export default App
\ No newline at end of file
+export default routes
\ No newline at end of file
diff --git a/seatunnel-ui/src/App.tsx b/seatunnel-ui/src/utils/index.ts
similarity index 71%
copy from seatunnel-ui/src/App.tsx
copy to seatunnel-ui/src/utils/index.ts
index 7ceca19d9..f76fbc629 100644
--- a/seatunnel-ui/src/App.tsx
+++ b/seatunnel-ui/src/utils/index.ts
@@ -15,23 +15,10 @@
* limitations under the License.
*/
-import { defineComponent } from 'vue'
-import { NButton } from 'naive-ui'
-import { useI18n } from 'vue-i18n'
+import mapping from './mapping'
-const App = defineComponent({
- setup() {
- const { t } = useI18n()
+const utils = {
+ mapping
+}
- return { t }
- },
- render() {
- const { t } = this
-
- return (
- <NButton>{t('test.test')}</NButton>
- )
- }
-})
-
-export default App
\ No newline at end of file
+export default utils
\ No newline at end of file
diff --git a/seatunnel-ui/src/App.tsx b/seatunnel-ui/src/utils/mapping.ts
similarity index 59%
copy from seatunnel-ui/src/App.tsx
copy to seatunnel-ui/src/utils/mapping.ts
index 7ceca19d9..27d754ff7 100644
--- a/seatunnel-ui/src/App.tsx
+++ b/seatunnel-ui/src/utils/mapping.ts
@@ -15,23 +15,24 @@
* limitations under the License.
*/
-import { defineComponent } from 'vue'
-import { NButton } from 'naive-ui'
-import { useI18n } from 'vue-i18n'
-
-const App = defineComponent({
- setup() {
- const { t } = useI18n()
-
- return { t }
- },
- render() {
- const { t } = this
-
- return (
- <NButton>{t('test.test')}</NButton>
- )
- }
-})
-
-export default App
\ No newline at end of file
+import type { Component } from 'vue'
+
+const mapping = (modules: any) => {
+ const components: { [key: string]: Component } = {}
+ Object.keys(modules).forEach((key: string) => {
+ const nameMatch: string[] | null = key.match(/^\/src\/views\/(.+)\.tsx/)
+
+ if (!nameMatch) { return }
+
+ const indexMatch: string[] | null = nameMatch[1].match(/(.*)\/Index$/i)
+
+ let name: string = indexMatch ? indexMatch[1] : nameMatch[1]
+
+ name = name.replaceAll('/', '-')
+
+ components[name] = modules[key]
+ })
+ return components
+}
+
+export default mapping
\ No newline at end of file
diff --git a/seatunnel-ui/src/App.tsx b/seatunnel-ui/src/views/login/index.tsx
similarity index 79%
copy from seatunnel-ui/src/App.tsx
copy to seatunnel-ui/src/views/login/index.tsx
index 7ceca19d9..92e1cfdbc 100644
--- a/seatunnel-ui/src/App.tsx
+++ b/seatunnel-ui/src/views/login/index.tsx
@@ -16,22 +16,18 @@
*/
import { defineComponent } from 'vue'
-import { NButton } from 'naive-ui'
-import { useI18n } from 'vue-i18n'
-const App = defineComponent({
+const Login = defineComponent({
setup() {
- const { t } = useI18n()
- return { t }
},
render() {
- const { t } = this
-
return (
- <NButton>{t('test.test')}</NButton>
+ <div>
+ <h1>Login</h1>
+ </div>
)
}
})
-export default App
\ No newline at end of file
+export default Login
\ No newline at end of file
