From a5aea75f3779bb1a24041fa869568e6f81ac58e8 Mon Sep 17 00:00:00 2001
From: AetherWing <aoxiangtianyu_go@qq.com>
Date: Wed, 12 Aug 2026 10:27:51 +0800
Subject: [PATCH] feat: allow moving rules between prepend and append (#7214)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat: allow moving rules between prepend and append

* chore: merge import

---------

Co-authored-by: ❤是纱雾酱哟～ <49941141+Dragon1573@users.noreply.github.com>
---
 Changelog.md                                  |  1 +
 src/components/profile/rule-item.tsx          | 21 +++++++++++++++++--
 .../profile/rules-editor-viewer.tsx           | 12 +++++++++++
 3 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/Changelog.md b/Changelog.md
index f50014238..0b9c5c15c 100644
--- a/Changelog.md
+++ b/Changelog.md
@@ -26,5 +26,6 @@
 - 优化核心启动、停止及更新流程，减少竞态与残留进程
 - 优化首页当前节点的交互
 - Linux 代理设置缺失必要命令时，给出明确命令缺失信息，避免模糊报错
+- 支持在前置规则与后置规则之间直接切换规则位置
 
 </details>
diff --git a/src/components/profile/rule-item.tsx b/src/components/profile/rule-item.tsx
index 6c16bd37a..81b4a38ff 100644
--- a/src/components/profile/rule-item.tsx
+++ b/src/components/profile/rule-item.tsx
@@ -1,6 +1,11 @@
 import { useSortable } from '@dnd-kit/sortable'
 import { CSS } from '@dnd-kit/utilities'
-import { DeleteForeverRounded, UndoRounded } from '@mui/icons-material'
+import {
+  DeleteForeverRounded,
+  UndoRounded,
+  VerticalAlignBottomRounded,
+  VerticalAlignTopRounded,
+} from '@mui/icons-material'
 import {
   Box,
   IconButton,
@@ -13,10 +18,12 @@ interface Props {
   type: 'prepend' | 'original' | 'delete' | 'append'
   ruleRaw: string
   onDelete: () => void
+  onPrepend?: () => void
+  onAppend?: () => void
 }
 
 export const RuleItem = (props: Props) => {
-  const { type, ruleRaw, onDelete } = props
+  const { type, ruleRaw, onDelete, onPrepend, onAppend } = props
   const sortable = type === 'prepend' || type === 'append'
   const rule = ruleRaw.replace(',no-resolve', '')
 
@@ -105,6 +112,16 @@ export const RuleItem = (props: Props) => {
           },
         }}
       />
+      {type === 'prepend' && (
+        <IconButton onClick={onAppend}>
+          <VerticalAlignBottomRounded />
+        </IconButton>
+      )}
+      {type === 'append' && (
+        <IconButton onClick={onPrepend}>
+          <VerticalAlignTopRounded />
+        </IconButton>
+      )}
       <IconButton onClick={onDelete}>
         {type === 'delete' ? <UndoRounded /> : <DeleteForeverRounded />}
       </IconButton>
diff --git a/src/components/profile/rules-editor-viewer.tsx b/src/components/profile/rules-editor-viewer.tsx
index 925f968d6..2888b635d 100644
--- a/src/components/profile/rules-editor-viewer.tsx
+++ b/src/components/profile/rules-editor-viewer.tsx
@@ -315,6 +315,12 @@ export const RulesEditorViewer = (props: Props) => {
                   onDelete={() => {
                     setPrependSeq(prependSeq.filter((v) => v !== item))
                   }}
+                  onAppend={() => {
+                    setAppendSeq((prev) =>
+                      prev.includes(item) ? prev : [...prev, item],
+                    )
+                    setPrependSeq(prependSeq.filter((v) => v !== item))
+                  }}
                 />
               )
             })}
@@ -364,6 +370,12 @@ export const RulesEditorViewer = (props: Props) => {
                   onDelete={() => {
                     setAppendSeq(appendSeq.filter((v) => v !== item))
                   }}
+                  onPrepend={() => {
+                    setPrependSeq((prev) =>
+                      prev.includes(item) ? prev : [...prev, item],
+                    )
+                    setAppendSeq(appendSeq.filter((v) => v !== item))
+                  }}
                 />
               )
             })}