[Feat][UI] Complete the function of setting table fields. (#36)
diff --git a/seatunnel-ui/src/common/table.ts b/seatunnel-ui/src/common/table.ts
new file mode 100644
index 0000000..b3e5e63
--- /dev/null
+++ b/seatunnel-ui/src/common/table.ts
@@ -0,0 +1,44 @@
+/*
+ * 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 { 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 9e35075..bea9dcc 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 9a3e675..99de8af 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 39a82a2..ac3b7c9 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 e3b9561..eaba9da 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/store/setting/index.ts b/seatunnel-ui/src/store/setting/index.ts
new file mode 100644
index 0000000..03cbe90
--- /dev/null
+++ b/seatunnel-ui/src/store/setting/index.ts
@@ -0,0 +1,44 @@
+/*
+ * 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 { 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 87%
rename from seatunnel-ui/src/views/setting/use-setting.ts
rename to seatunnel-ui/src/store/setting/types.ts
index 3e7c6c2..d45fe2c 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 bc695ca..8391553 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 { 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 @@
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 @@
]
}
- const handleDelete = (row: any) => {
+ const handleDelete = (row: ScriptDetail) => {
state.showDeleteModal = true
state.row = row
}
@@ -144,7 +146,7 @@
})
}
- 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 ee7b9ec..9bbc9bb 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 @@
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'
@@ -50,16 +55,6 @@
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',
render: (row: JobDetail) =>
diff --git a/seatunnel-ui/src/views/setting/index.tsx b/seatunnel-ui/src/views/setting/index.tsx
index cb60666..e7daa04 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 @@
<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 753f2af..127268b 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 { 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 @@
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 64fb41f..a1211c3 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 { 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 @@
const createColumns = (state: any) => {
state.columns = [
+ ...getTableColumn([{ key: 'id', title: t('user_manage.id') }]),
{
title: t('user_manage.username'),
key: 'name'