HI-VPN/hi-frontend
4
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

🐛 fix node sort persistence on drag reorder

Browse Source
This commit is contained in:
ppanel-web 2026-02-12 23:03:08 +00:00 committed by shanshanzhong
parent dc55d85056
commit 98da7b1476
1 changed files with 17 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
apps/admin/src/sections/nodes/index.tsx
View File

@ -226,6 +226,9 @@ export default function Nodes() {
),
}}
onSort={async (source, target, items) => {
// NOTE: `items` is the current page's items from ProTable.
// We should avoid mutating it in-place, and we should persist the sort
// changes reliably (await the API call).
const sourceIndex = items.findIndex(
(item) => String(item.id) === source
);
@ -233,23 +236,31 @@ export default function Nodes() {
(item) => String(item.id) === target
);
if (sourceIndex === -1 || targetIndex === -1) return items;
const prevSortById = new Map(items.map((it) => [it.id, it.sort]));
const originalSorts = items.map((item) => item.sort);
const [movedItem] = items.splice(sourceIndex, 1);
items.splice(targetIndex, 0, movedItem!);
const next = items.slice();
const [movedItem] = next.splice(sourceIndex, 1);
next.splice(targetIndex, 0, movedItem!);
const updatedItems = items.map((item, index) => {
// Keep the existing `sort` values bound to positions (so reordering swaps
// sort values instead of inventing new ones).
const updatedItems = next.map((item, index) => {
const originalSort = originalSorts[index];
const newSort = originalSort !== undefined ? originalSort : item.sort;
return { ...item, sort: newSort };
});
const changedItems = updatedItems.filter(
(item, index) => item.sort !== items[index]?.sort
(item) => item.sort !== prevSortById.get(item.id)
);
if (changedItems.length > 0) {
resetSortWithNode({
await resetSortWithNode({
// Send all changed rows (within the current page) so backend can
// persist the new ordering.
sort: changedItems.map((item) => ({
id: item.id,
sort: item.sort,
@ -257,6 +268,7 @@ export default function Nodes() {
});
toast.success(t("sorted_success", "Sorted successfully"));
}
return updatedItems;
}}
params={[{ key: "search" }]}