You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@seatunnel.apache.org by so...@apache.org on 2023/03/02 06:17:34 UTC
[incubator-seatunnel-web] branch main updated: [Feat][UI] Complete the function of setting table fields. (#36)
This is an automated email from the ASF dual-hosted git repository.
songjian pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/incubator-seatunnel-web.git
The following commit(s) were added to refs/heads/main by this push:
new 1d46017f [Feat][UI] Complete the function of setting table fields. (#36)
1d46017f is described below
commit 1d46017f02893fecca81a044374535bf36beae96
Author: songjianet <17...@qq.com>
AuthorDate: Thu Mar 2 14:17:29 2023 +0800
[Feat][UI] Complete the function of setting table fields. (#36)
---
.../src/{locales/en_US/jobs.ts => common/table.ts} | 36 ++++++++++++++------
seatunnel-ui/src/locales/en_US/data-pipes.ts | 1 +
seatunnel-ui/src/locales/en_US/jobs.ts | 2 ++
seatunnel-ui/src/locales/en_US/tasks.ts | 2 ++
seatunnel-ui/src/locales/en_US/user-manage.ts | 1 +
.../en_US/jobs.ts => store/setting/index.ts} | 38 +++++++++++++++-------
.../use-setting.ts => store/setting/types.ts} | 7 ++++
.../src/views/data-pipes/list/use-table.ts | 6 ++--
seatunnel-ui/src/views/jobs/list/use-table.ts | 17 ++++------
seatunnel-ui/src/views/setting/index.tsx | 15 +++++++--
seatunnel-ui/src/views/tasks/list/use-table.ts | 5 +++
.../src/views/user-manage/list/use-table.ts | 2 ++
12 files changed, 96 insertions(+), 36 deletions(-)
diff --git a/seatunnel-ui/src/locales/en_US/jobs.ts b/seatunnel-ui/src/common/table.ts
similarity index 58%
copy from seatunnel-ui/src/locales/en_US/jobs.ts
copy to seatunnel-ui/src/common/table.ts
index 9a3e6755..b3e5e63d 100644
--- a/seatunnel-ui/src/locales/en_US/jobs.ts
+++ b/seatunnel-ui/src/common/table.ts
@@ -15,14 +15,30 @@
* limitations under the License.
*/
-export default {
- jobs: 'Jobs',
- search: 'Search',
- data_pipe_name: 'Data Pipe Name',
- plan: 'Plan',
- create_date: 'Create Date',
- publish: 'Publish',
- operation: 'Operation',
- execute: 'Execute',
- recycle: 'Recycle'
+import { useSettingStore } from '@/store/setting'
+
+const getTableColumn = (data: Array<{ key: string; title: string }>) => {
+ const tableColumn = []
+ const settingStore = useSettingStore()
+
+ settingStore.getSequenceColumn &&
+ tableColumn.push({
+ title: '#',
+ key: 'index',
+ render: (row: any, index: number) => index + 1
+ })
+
+ settingStore.getDataUniqueValue &&
+ tableColumn.push(
+ ...data.map((i) => {
+ return {
+ title: i.title,
+ key: i.key
+ }
+ })
+ )
+
+ return tableColumn
}
+
+export { getTableColumn }
diff --git a/seatunnel-ui/src/locales/en_US/data-pipes.ts b/seatunnel-ui/src/locales/en_US/data-pipes.ts
index 9e35075a..bea9dcc2 100644
--- a/seatunnel-ui/src/locales/en_US/data-pipes.ts
+++ b/seatunnel-ui/src/locales/en_US/data-pipes.ts
@@ -16,6 +16,7 @@
*/
export default {
+ id: 'Id',
data_pipes: 'Data Pipes',
create: 'Create',
name: 'Name',
diff --git a/seatunnel-ui/src/locales/en_US/jobs.ts b/seatunnel-ui/src/locales/en_US/jobs.ts
index 9a3e6755..99de8afb 100644
--- a/seatunnel-ui/src/locales/en_US/jobs.ts
+++ b/seatunnel-ui/src/locales/en_US/jobs.ts
@@ -16,6 +16,8 @@
*/
export default {
+ script_id: 'Script Id',
+ job_id: 'Job Id',
jobs: 'Jobs',
search: 'Search',
data_pipe_name: 'Data Pipe Name',
diff --git a/seatunnel-ui/src/locales/en_US/tasks.ts b/seatunnel-ui/src/locales/en_US/tasks.ts
index 39a82a27..ac3b7c99 100644
--- a/seatunnel-ui/src/locales/en_US/tasks.ts
+++ b/seatunnel-ui/src/locales/en_US/tasks.ts
@@ -16,6 +16,8 @@
*/
export default {
+ instance_id: 'Instance Id',
+ job_id: 'Job Id',
tasks: 'Tasks',
search: 'Search',
success: 'Success',
diff --git a/seatunnel-ui/src/locales/en_US/user-manage.ts b/seatunnel-ui/src/locales/en_US/user-manage.ts
index e3b95613..eaba9da0 100644
--- a/seatunnel-ui/src/locales/en_US/user-manage.ts
+++ b/seatunnel-ui/src/locales/en_US/user-manage.ts
@@ -16,6 +16,7 @@
*/
export default {
+ id: 'Id',
user_manage: 'User Manage',
create: 'Create',
username: 'Username',
diff --git a/seatunnel-ui/src/locales/en_US/jobs.ts b/seatunnel-ui/src/store/setting/index.ts
similarity index 56%
copy from seatunnel-ui/src/locales/en_US/jobs.ts
copy to seatunnel-ui/src/store/setting/index.ts
index 9a3e6755..03cbe909 100644
--- a/seatunnel-ui/src/locales/en_US/jobs.ts
+++ b/seatunnel-ui/src/store/setting/index.ts
@@ -15,14 +15,30 @@
* limitations under the License.
*/
-export default {
- jobs: 'Jobs',
- search: 'Search',
- data_pipe_name: 'Data Pipe Name',
- plan: 'Plan',
- create_date: 'Create Date',
- publish: 'Publish',
- operation: 'Operation',
- execute: 'Execute',
- recycle: 'Recycle'
-}
+import { defineStore } from 'pinia'
+import { SettingStore } from './types'
+
+export const useSettingStore = defineStore({
+ id: 'setting',
+ state: (): SettingStore => ({
+ sequenceColumn: false,
+ dataUniqueValue: false
+ }),
+ persist: true,
+ getters: {
+ getSequenceColumn(): boolean {
+ return this.sequenceColumn
+ },
+ getDataUniqueValue(): boolean {
+ return this.dataUniqueValue
+ }
+ },
+ actions: {
+ setSequenceColumn(status: boolean): void {
+ this.sequenceColumn = status
+ },
+ setDataUniqueValue(status: boolean): void {
+ this.dataUniqueValue = status
+ }
+ }
+})
diff --git a/seatunnel-ui/src/views/setting/use-setting.ts b/seatunnel-ui/src/store/setting/types.ts
similarity index 88%
rename from seatunnel-ui/src/views/setting/use-setting.ts
rename to seatunnel-ui/src/store/setting/types.ts
index 3e7c6c26..d45fe2cf 100644
--- a/seatunnel-ui/src/views/setting/use-setting.ts
+++ b/seatunnel-ui/src/store/setting/types.ts
@@ -14,3 +14,10 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
+
+interface SettingStore {
+ sequenceColumn: boolean
+ dataUniqueValue: boolean
+}
+
+export { SettingStore }
diff --git a/seatunnel-ui/src/views/data-pipes/list/use-table.ts b/seatunnel-ui/src/views/data-pipes/list/use-table.ts
index bc695ca2..8391553d 100644
--- a/seatunnel-ui/src/views/data-pipes/list/use-table.ts
+++ b/seatunnel-ui/src/views/data-pipes/list/use-table.ts
@@ -20,6 +20,7 @@ import { useI18n } from 'vue-i18n'
import { NSpace, NButton, NTag } from 'naive-ui'
import { scriptList, scriptDelete } from '@/service/script'
import { useRouter } from 'vue-router'
+import { getTableColumn } from '@/common/table'
import type { ResponseTable } from '@/service/types'
import type { ScriptDetail } from '@/service/script/types'
import type { Router } from 'vue-router'
@@ -41,6 +42,7 @@ export function useTable() {
const createColumns = (state: any) => {
state.columns = [
+ ...getTableColumn([{ key: 'id', title: t('data_pipes.id') }]),
{
title: t('data_pipes.name'),
key: 'name',
@@ -125,7 +127,7 @@ export function useTable() {
]
}
- const handleDelete = (row: any) => {
+ const handleDelete = (row: ScriptDetail) => {
state.showDeleteModal = true
state.row = row
}
@@ -144,7 +146,7 @@ export function useTable() {
})
}
- const handlePublish = (row: any) => {
+ const handlePublish = (row: ScriptDetail) => {
state.showPublishModal = true
state.row = row
}
diff --git a/seatunnel-ui/src/views/jobs/list/use-table.ts b/seatunnel-ui/src/views/jobs/list/use-table.ts
index ee7b9ecb..9bbc9bbd 100644
--- a/seatunnel-ui/src/views/jobs/list/use-table.ts
+++ b/seatunnel-ui/src/views/jobs/list/use-table.ts
@@ -17,8 +17,9 @@
import { useI18n } from 'vue-i18n'
import { h, reactive, ref } from 'vue'
-import { NButton, NSpace, NSwitch } from 'naive-ui'
+import { NButton, NSpace } from 'naive-ui'
import { taskJobList, taskExecute, taskRecycle } from '@/service/task'
+import { getTableColumn } from '@/common/table'
import type { ResponseTable } from '@/service/types'
import type { JobDetail } from '@/service/task/types'
@@ -37,6 +38,10 @@ export function useTable() {
const createColumns = (state: any) => {
state.columns = [
+ ...getTableColumn([
+ { key: 'scriptId', title: t('jobs.script_id') },
+ { key: 'jobId', title: t('jobs.job_id') }
+ ]),
{
title: t('jobs.data_pipe_name'),
key: 'datapipeName'
@@ -49,16 +54,6 @@ export function useTable() {
title: t('jobs.create_date'),
key: 'createTime'
},
- {
- title: t('jobs.publish'),
- key: 'publish',
- render: (row: JobDetail) =>
- h(NSwitch, {
- round: false,
- defaultValue: row.publish,
- disabled: true
- })
- },
{
title: t('jobs.operation'),
key: 'operation',
diff --git a/seatunnel-ui/src/views/setting/index.tsx b/seatunnel-ui/src/views/setting/index.tsx
index cb606665..e7daa044 100644
--- a/seatunnel-ui/src/views/setting/index.tsx
+++ b/seatunnel-ui/src/views/setting/index.tsx
@@ -18,6 +18,7 @@
import { defineComponent } from 'vue'
import { useI18n } from 'vue-i18n'
import { NSpace, NCard, NSwitch, NList, NListItem, NSelect } from 'naive-ui'
+import { useSettingStore } from '@/store/setting'
const Setting = defineComponent({
name: 'Setting',
@@ -36,13 +37,23 @@ const Setting = defineComponent({
<NListItem>
<NSpace justify='space-between' align='center'>
<span>{this.t('setting.sequence_column')}</span>
- <NSwitch />
+ <NSwitch
+ value={useSettingStore().getSequenceColumn}
+ onUpdateValue={(s) => {
+ useSettingStore().setSequenceColumn(s)
+ }}
+ />
</NSpace>
</NListItem>
<NListItem>
<NSpace justify='space-between' align='center'>
<span>{this.t('setting.data_unique_value')}</span>
- <NSwitch />
+ <NSwitch
+ value={useSettingStore().getDataUniqueValue}
+ onUpdateValue={(s) => {
+ useSettingStore().setDataUniqueValue(s)
+ }}
+ />
</NSpace>
</NListItem>
</NList>
diff --git a/seatunnel-ui/src/views/tasks/list/use-table.ts b/seatunnel-ui/src/views/tasks/list/use-table.ts
index 753f2afb..127268bb 100644
--- a/seatunnel-ui/src/views/tasks/list/use-table.ts
+++ b/seatunnel-ui/src/views/tasks/list/use-table.ts
@@ -19,6 +19,7 @@ import { useI18n } from 'vue-i18n'
import { h, reactive, ref } from 'vue'
import { NButton, NSpace, NTag } from 'naive-ui'
import { taskInstanceList, taskInstanceKill } from '@/service/task'
+import { getTableColumn } from '@/common/table'
import type { ResponseTable } from '@/service/types'
import type { JobDetail } from '@/service/task/types'
@@ -39,6 +40,10 @@ export function useTable() {
const createColumns = (state: any) => {
state.columns = [
+ ...getTableColumn([
+ { key: 'instanceId', title: t('tasks.instance_id') },
+ { key: 'jobId', title: t('tasks.job_id') }
+ ]),
{
title: t('tasks.task_name'),
key: 'instanceName'
diff --git a/seatunnel-ui/src/views/user-manage/list/use-table.ts b/seatunnel-ui/src/views/user-manage/list/use-table.ts
index 64fb41fe..a1211c3e 100644
--- a/seatunnel-ui/src/views/user-manage/list/use-table.ts
+++ b/seatunnel-ui/src/views/user-manage/list/use-table.ts
@@ -19,6 +19,7 @@ import { reactive, ref, h } from 'vue'
import { useI18n } from 'vue-i18n'
import { NSpace, NButton } from 'naive-ui'
import { userList, userDelete, userEnable, userDisable } from '@/service/user'
+import { getTableColumn } from '@/common/table'
import type { ResponseTable } from '@/service/types'
import type { UserDetail } from '@/service/user/types'
@@ -39,6 +40,7 @@ export function useTable() {
const createColumns = (state: any) => {
state.columns = [
+ ...getTableColumn([{ key: 'id', title: t('user_manage.id') }]),
{
title: t('user_manage.username'),
key: 'name'