[Feat][UI] Add routes configuration.

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>
     )
   }
 })

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')

seatunnel-ui/src/router/index.ts

@@ -0,0 +1,37 @@
+/*
+ * 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 {
+  createRouter,
+  createWebHistory
+} from 'vue-router'
+import routes from './routes'
+import NProgress from 'nprogress'
+import 'nprogress/nprogress.css'
+
+const router = createRouter({
+  history: createWebHistory(
+   '/'
+  ),
+  routes
+})
+
+router.afterEach(() => {
+  NProgress.done()
+})
+
+export default router

seatunnel-ui/src/router/routes.ts

@@ -0,0 +1,42 @@
+/*
+ * 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 utils from '@/utils'
+import type { RouteRecordRaw } from 'vue-router'
+import type { Component } from 'vue'
+
+const modules = import.meta.glob('/src/views/**/**.tsx')
+const components: { [key: string]: Component } = utils.mapping(modules)
+
+const basePage: RouteRecordRaw[] = [
+
+]
+
+const loginPage: RouteRecordRaw[] = [
+  {
+    path: '/login',
+    name: 'login',
+    component: components['login'],
+    meta: {
+      auth: []
+    }
+  }
+]
+
+const routes: RouteRecordRaw[] = [...basePage, ...loginPage]
+
+export default routes

seatunnel-ui/src/utils/index.ts

@@ -0,0 +1,24 @@
+/*
+ * 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 mapping from './mapping'
+
+const utils = {
+  mapping
+}
+
+export default utils

seatunnel-ui/src/utils/mapping.ts

@@ -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 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

seatunnel-ui/src/views/login/index.tsx

@@ -0,0 +1,33 @@
+/*
+ * 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 } from 'vue'
+
+const Login = defineComponent({
+  setup() {
+
+  },
+  render() {
+    return (
+      <div>
+        <h1>Login</h1>
+      </div>
+    )
+  }
+})
+
+export default Login