[linkis-web-next]: Modules refactoring & Bug fixing (#5169)

* GlobalHistoryManagement and SideBar modules refactoring & previous bug fixing * [Linkis-web-next]: parameterConfig Module Refactor * [Linkis-web-next]: Add code comments to ParameterConfig Module * [linkis-web-next]: Refactored Navbar & Login Page * [linkis-web-next]: 1. TaskResults & TaskDetails Refactoring; 2. Code Improvement & Bug Fixing; * [linkis-web-next]: Refactored GlobalVariables Module * [linkis-web-next]: Add license to newly created file * [linkis-web-next]: Microservice Management Module Refactoring * [linkis-web-next]: Resource Management Module Refactoring * [linkis-web-next]: ECM Management Module Refactoring * [linkis-web-next]: Base Data Management & Data Source Management & UDF Function Management Modules Refactoring * [linkis-web-next]: remove duplicate codes * [linkis-web-next]: Modify README files
apache · Oct 16, 2024 · 3f55207 · 3f55207
1 parent aed8d53
commit 3f55207
Show file tree

Hide file tree

Showing 26 changed files with 1,599 additions and 91 deletions.
diff --git a/linkis-web-next/README.md b/linkis-web-next/README.md
@@ -1,5 +1,5 @@
 <h2 align="center">
-  Apache Linkis Web
+  Apache Linkis Web Next
 </h2>
 
 <p align="center">
@@ -56,7 +56,28 @@
 
  Linkis builds a layer of computation middleware between upper applications and underlying engines. By using standard interfaces such as REST/WS/JDBC provided by Linkis, the upper applications can easily access the underlying engines such as MySQL/Spark/Hive/Presto/Flink, etc., and achieve the intercommunication of user resources like unified variables, scripts, UDFs, functions and resource files at the same time.
 
-Linkis Web provides a management system for easy management of user resources.
+ Linkis Web provides a web management system to facilitate the management of user resources. However, the original Linkis Web project was developed using Vue2 and related technologies, but Vue2 has stopped maintenance and lacks community support. In addition, the file structure of the project itself is unclear, the module division is unreasonable, the component library used is also lacking maintenance, and the user experience of the interactive interface needs to be optimized.
+
+ As mentioned above, still iterating on the original project may leave various difficult problems. Therefore, we finally considered refactoring the project under the Linkis Web Next project, upgrading the core technology stack from Vue2 + Webpack to Vue3 + Vite, obtaining more community support, greatly improving the project starting and building rate, and solving various historical problems. Besides, using the internally maintained open-source UI component library Fes-Design, the problems can be promptly fed back and repaired.
+
+The modules that have been refactored are as follows:
+
+| The modules that have been refactored
+| ---------------------------------------
+| Login Page
+| Nav Bar
+| Side Bar
+| Global History Management
+| Parameter Config
+| Global Variables
+| Microservice Management
+| Resource Management
+| ECM Management
+| Base Data Management (SubModule Error Management)
+| Data Source Management (SubModule Data Source Access Permissions)
+| UDF Function Management (SubModule UDF User Management)
+
+Sub-modules in Base Data Management, Data Source Management, and UDF Function Management will still need to be refactored in the future.
 
 # Start
 
@@ -70,46 +91,6 @@ npm run dev
 npm run build
 ```
 
-# File Structure
-
-> ├── README.md
-> ├── README_CN.md
-> ├── index.html
-> ├── node_modules
-> ├── package-lock.json
-> ├── package.json
-> ├── pom.xml
-> ├── public
-> │   ├── favicon.ico`
-> │   ├── sidebar
-> │   └── vite.svg
-> ├── release-docs
-> │   ├── LICENSE
-> │   ├── NOTICE
-> │   └── licenses
-> ├── src
-> │   ├── App.vue
-> │   ├── assets
-> │   ├── components
-> │   ├── config
-> │   ├── dss
-> │   ├── env.d.ts
-> │   ├── helper
-> │   ├── index.d.ts
-> │   ├── layout.vue
-> │   ├── locales
-> │   ├── main.ts
-> │   ├── pages
-> │   ├── router
-> │   ├── scriptis
-> │   ├── service
-> │   ├── style
-> │   ├── util
-> │   └── vite-env.d.ts
-> ├── tsconfig.json
-> ├── tsconfig.node.json
-> └── vite.config.ts
-
 # Contributing
 
 Contributions are always welcomed, we need more contributors to build Linkis together. either code, or doc, or other supports that could help the community.  

diff --git a/linkis-web-next/README_CN.md b/linkis-web-next/README_CN.md
@@ -1,5 +1,5 @@
 <h2 align="center">
-  Apache Linkis Web
+  Apache Linkis Web Next
 </h2>
 
 <p align="center">
@@ -56,7 +56,28 @@
 Linkis 在上层应用程序和底层引擎之间构建了一层计算中间件。通过使用 Linkis 提供的 REST/WebSocket/JDBC 等标准接口，
 上层应用可以方便地连接访问 MySQL/Spark/Hive/Presto/Flink 等底层引擎，同时实现变量、脚本、函数和资源文件等用户资源的跨上层应用互通。  
 
-Linkis Web 提供了一个可视化的后台管理系统，便于对用户资源进行管理。
+Linkis Web 提供了一个可视化的后台管理系统，便于对用户资源进行管理。然而，原有的 Linkis Web 项目使用了 Vue2 及相关技术进行开发，而 Vue2 已停止维护，缺乏社区生态支持，并且项目本身文件结构不清晰，模块划分不合理，所使用的组件库也缺乏维护，并且交互界面的用户体验也有待优化。
+
+在此背景下，选择在原有的项目上继续进行迭代可能留下各种难以解决的问题。所以最终考虑在 Linkis Web Next 子项目下重构该项目，将核心技术栈从 Vue2 + Webpack 升级到 Vue3 + Vite，获得更多的社区生态支持并大大提高项目启动和构建速率，同时解决各种历史遗留问题。再使用内部长期维护的开源组件库 Fes-Design，就能使组件库支持的问题能够得到及时的反馈和修复，保障项目迭代的顺利进行。
+
+当前已重构完成的模块如下所示：
+
+| 已重构完成模块
+| ---------------------------------------
+| Login Page
+| Nav Bar
+| Side Bar
+| Global History Management
+| Parameter Config
+| Global Variables
+| Microservice Management
+| Resource Management
+| ECM Management
+| Base Data Management (SubModule Error Management)
+| Data Source Management (SubModule Data Source Access Permissions)
+| UDF Function Management (SubModule UDF User Management)
+
+后续仍需继续重构Base Data Management、Data Source Management、UDF Function Management中的子模块。
 
 # 启动
 
@@ -70,46 +91,6 @@ npm run dev
 npm run build
 ```
 
-# 文件结构
-
-> ├── README.md
-> ├── README_CN.md
-> ├── index.html
-> ├── node_modules
-> ├── package-lock.json
-> ├── package.json
-> ├── pom.xml
-> ├── public
-> │   ├── favicon.ico`
-> │   ├── sidebar
-> │   └── vite.svg
-> ├── release-docs
-> │   ├── LICENSE
-> │   ├── NOTICE
-> │   └── licenses
-> ├── src
-> │   ├── App.vue
-> │   ├── assets
-> │   ├── components
-> │   ├── config
-> │   ├── dss
-> │   ├── env.d.ts
-> │   ├── helper
-> │   ├── index.d.ts
-> │   ├── layout.vue
-> │   ├── locales
-> │   ├── main.ts
-> │   ├── pages
-> │   ├── router
-> │   ├── scriptis
-> │   ├── service
-> │   ├── style
-> │   ├── util
-> │   └── vite-env.d.ts
-> ├── tsconfig.json
-> ├── tsconfig.node.json
-> └── vite.config.ts
-
 # 贡献
 
 我们非常欢迎和期待更多的贡献者参与共建 Linkis, 不论是代码、文档，或是其他能够帮助到社区的贡献形式。  

diff --git a/linkis-web-next/src/components/sidebar/index.vue b/linkis-web-next/src/components/sidebar/index.vue
@@ -114,20 +114,39 @@ const menuItemsConfig = [
     {
         title: 'message.linkis.sideNavList.function.children.dataSourceManage',
         icon: '/sidebar/dataSourceManage.svg',
-        path: '/xxxx',
-        items: [{ title: 'xxx', path: '/xxxx' }],
+        path: '/console/dataSourceManage',
+        items: [
+            { title: 'message.linkis.sideNavList.function.children.dataSourceManage', path: '/console/dataSourceManage/dataSourceManagement' },
+            { title: 'message.linkis.sideNavList.function.children.datasourceEnv', path: '/console/dataSourceManage/datasourceEnv' },
+            { title: 'message.linkis.sideNavList.function.children.datasourceType', path: '/console/dataSourceManage/datasourceType' },
+            { title: 'message.linkis.sideNavList.function.children.datasourceAccess', path: '/console/dataSourceManage/datasourceAccess' },
+            { title: 'message.linkis.sideNavList.function.children.datasourceTypeKey', path: '/console/dataSourceManage/datasourceTypeKey' },
+        ],
     },
     {
         title: 'message.linkis.sideNavList.function.children.udfFunctionTitle',
         icon: '/sidebar/udfFunctionTitle.svg',
-        path: '/xxxxx',
-        items: [{ title: 'xxx', path: '/xxxxx' }],
+        path: '/console/udfFunctionTitle',
+        items: [
+            { title: 'message.linkis.sideNavList.function.children.udfFunctionManage', path: '/console/udfFunctionTitle/udfFunctionManage' },
+            { title: 'message.linkis.sideNavList.function.children.functionManagement', path: '/console/udfFunctionTitle/functionManagement' },
+            { title: 'message.linkis.sideNavList.function.children.udfManager', path: '/console/udfFunctionTitle/udfManager' },
+            { title: 'message.linkis.sideNavList.function.children.udfTree', path: '/console/udfFunctionTitle/udfTree' },
+        ],
     },
     {
         title: 'message.linkis.sideNavList.function.children.basedataManagement',
         icon: '/sidebar/basedataManagement.svg',
-        path: '/xxxxxx',
-        items: [{ title: 'xxx', path: '/xxxxxx' }],
+        path: '/console/basedataManagement',
+        items: [
+            { title: 'message.linkis.sideNavList.function.children.gatewayAuthToken', path: '/console/basedataManagement/gatewayAuthToken' },
+            { title: 'message.linkis.sideNavList.function.children.errorCode', path: '/console/basedataManagement/errorCode' },
+            { title: 'message.linkis.sideNavList.function.children.rmExternalResourceProvider', path: '/console/basedataManagement/rmExternalResourceProvider' },
+            { title: 'message.linkis.sideNavList.function.children.EnginePluginManagement', path: '/console/basedataManagement/EnginePluginManagement' },
+            { title: 'message.linkis.sideNavList.function.children.tenantTagManagement', path: '/console/basedataManagement/tenantTagManagement' },
+            { title: 'message.linkis.sideNavList.function.children.ipListManagement', path: '/console/basedataManagement/ipListManagement' },
+            { title: 'message.linkis.sideNavList.function.children.configManagement', path: '/console/basedataManagement/configManagement' },
+        ],
     },
     {
         title: 'message.linkis.sideNavList.function.children.codeQuery',

diff --git a/linkis-web-next/src/locales/en.ts b/linkis-web-next/src/locales/en.ts
@@ -41,6 +41,7 @@ export default {
             resultList: 'Resultset',
             process: 'Execution Time:',
             ok: 'OK',
+            add: 'Add',
             cancel: 'Cancel',
             delete: 'Delete',
             failedNotice: 'Invalid items found, please check and then retry!',
@@ -562,6 +563,7 @@ export default {
                 startTime: 'Start Time',
                 costTime: 'Time Elapsed',
                 executeApplicationName: 'Execution Engine',
+                requestApplicationName: 'Application',
                 creator: 'Created From',
                 user: 'User',
                 createdTime: 'Created at',
@@ -604,6 +606,7 @@ export default {
                         ECMManage: 'ECM Management',
                         udfFunctionTitle: 'UDF Function',
                         udfFunctionManage: 'UDF Management',
+                        functionManagement: 'Function Management',
                         dataSourceManage: 'DataSource Management',
                         userResourceManagement: 'User Resource Management',
                         tenantTagManagement: 'Tenant Tag Management',
@@ -614,6 +617,7 @@ export default {
                             'Engine Configuration Template',
                         rmExternalResourceProvider:
                             'External Resource Provider Manage',
+                        configManagement: 'Config Management',
                         udfManager: 'UDF User Manage',
                         udfTree: 'UDF Tree',
                         datasourceAccess: 'Data source access permissions',
@@ -893,6 +897,11 @@ export default {
                 search: 'Search',
                 action: 'Action',
                 categoryMaxLength: 'The length cannot exceed 100',
+                tableId: 'Table ID',
+                applicationId: 'Application ID',
+                visitor: 'Visitor',
+                field: 'Field',
+                accessTime: 'Access Time',
                 modal: {
                     confirm: 'Confirm',
                     cancel: 'Cancel',

diff --git a/linkis-web-next/src/locales/zh.ts b/linkis-web-next/src/locales/zh.ts
@@ -40,6 +40,7 @@ export default {
             resultList: '结果集',
             process: '任务ID',
             ok: '确认',
+            add: '新增',
             cancel: '取消',
             delete: '删除',
             failedNotice: '验证项未通过，请检查后再试！',
@@ -584,6 +585,7 @@ export default {
                         errorCode: '错误码管理',
                         gatewayAuthToken: '令牌管理',
                         rmExternalResourceProvider: '扩展资源管理',
+                        configManagement: '配置项管理',
                         udfManager: '用户管理',
                         udfTree: 'UDF分类',
                         datasourceAccess: '数据源权限',
@@ -856,6 +858,11 @@ export default {
                 search: '搜索',
                 action: '操作',
                 categoryMaxLength: '分类名长度不能超过100',
+                tableId: '表ID',
+                applicationId: '应用ID',
+                visitor: '访问者',
+                field: '字段',
+                accessTime: '访问时间',
                 modal: {
                     confirm: '确定',
                     cancel: '取消',

diff --git a/linkis-web-next/src/pages/basedataManagement/EnginePluginManagement/index.vue b/linkis-web-next/src/pages/basedataManagement/EnginePluginManagement/index.vue
@@ -0,0 +1,28 @@
+<!--
+  ~ 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.
+  -->
+
+<template>
+
+</template>
+
+<script lang="ts" setup>
+
+</script>
+
+<style lang="less" scoped>
+
+</style>
diff --git a/linkis-web-next/src/pages/basedataManagement/configManagement/index.vue b/linkis-web-next/src/pages/basedataManagement/configManagement/index.vue
@@ -0,0 +1,28 @@
+<!--
+  ~ 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.
+  -->
+
+<template>
+
+</template>
+
+<script lang="ts" setup>
+
+</script>
+
+<style lang="less" scoped>
+
+</style>