From 17c5102e8a82cbfa51863ebdc76ae7b15496d7b2 Mon Sep 17 00:00:00 2001
From: ouyangxq <775153912@qq.com>
Date: Thu, 6 Aug 2026 19:18:48 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/shared/components/DataTable.test.ts |  2 +-
 src/shared/components/DataTable.vue     | 20 ++++++++++++++++++--
 2 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/src/shared/components/DataTable.test.ts b/src/shared/components/DataTable.test.ts
index 0e67b954..5ae9f829 100644
--- a/src/shared/components/DataTable.test.ts
+++ b/src/shared/components/DataTable.test.ts
@@ -72,7 +72,7 @@ describe('DataTable column preferences', () => {
   it('restores column order and visibility while locking the actions column', async () => {
     localStorage.setItem(preferenceStorageKey('table', 'user-1', 'orders-table'), JSON.stringify({
       version: 1,
-      order: ['actions', 'status', 'name'],
+      order: ['status', 'name', 'actions'],
       hidden: ['name', 'actions'],
     }))
     const wrapper = mountTable()
diff --git a/src/shared/components/DataTable.vue b/src/shared/components/DataTable.vue
index 3520ec10..6dcc46e0 100644
--- a/src/shared/components/DataTable.vue
+++ b/src/shared/components/DataTable.vue
@@ -101,15 +101,28 @@ function columnHideable(column: DataTableColumn) {
 const configurableColumns = computed(() => props.columns.filter((column) => columnId(column)))
 const columnKeys = computed(() => configurableColumns.value.map((column) => columnId(column) as string))
 
+function anchorSystemColumns(order: readonly string[]) {
+  const columnsByKey = new Map(configurableColumns.value.map((column) => [columnId(column) as string, column]))
+  const movableKeys = order.filter((key) => {
+    const column = columnsByKey.get(key)
+    return column && columnMovable(column)
+  })
+  let movableIndex = 0
+  return configurableColumns.value.map((column) => (
+    columnMovable(column) ? movableKeys[movableIndex++] : columnId(column) as string
+  ))
+}
+
 function applyPreference() {
   const defaultHidden = configurableColumns.value.flatMap((column) => column.defaultVisible === false ? [columnId(column) as string] : [])
-  preference.value = readLayoutPreference(
+  const snapshot = readLayoutPreference(
     'table',
     preferenceScope.value,
     props.preferenceKey || '',
     columnKeys.value,
     defaultHidden,
   )
+  preference.value = { ...snapshot, order: anchorSystemColumns(snapshot.order) }
 }
 
 watch(
@@ -159,7 +172,10 @@ function moveColumn(key: string, targetIndex: number) {
   movableKeys.splice(Math.min(Math.max(targetIndex, 0), movableKeys.length), 0, key)
   const movableSet = new Set(movableKeys)
   let nextMovableIndex = 0
-  const order = preference.value.order.map((id) => movableSet.has(id) ? movableKeys[nextMovableIndex++] : id)
+  const order = orderedColumns.value.map((column) => {
+    const id = columnId(column) as string
+    return movableSet.has(id) ? movableKeys[nextMovableIndex++] : id
+  })
   persistPreference(order)
 }