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'