diff --git a/app/src/assets/scss/component/_menu.scss b/app/src/assets/scss/component/_menu.scss
index 75a0c09a4..6313ddac1 100644
--- a/app/src/assets/scss/component/_menu.scss
+++ b/app/src/assets/scss/component/_menu.scss
@@ -281,6 +281,10 @@
     box-sizing: border-box;
     translate: var(--b3-transition);
 
+    &--show {
+      opacity: 1;
+    }
+
     &:hover {
       color: var(--b3-theme-on-background);
       background-color: var(--b3-list-icon-hover);
diff --git a/app/src/protyle/render/av/groups.ts b/app/src/protyle/render/av/groups.ts
index 63ed6781c..fb9fdec40 100644
--- a/app/src/protyle/render/av/groups.ts
+++ b/app/src/protyle/render/av/groups.ts
@@ -167,10 +167,10 @@ export const getGroupsHTML = (columns: IAVColumn[], view: IAVView) => {
             groupHTML = '<button class="b3-menu__separator"></button>';
             const disabledDrag = ["created", "date", "created", "updated"].includes(column.type);
             view.groups.forEach(item => {
-                groupHTML += `<button class="b3-menu__item" draggable="${disabledDrag ? "false" : "true"}">
+                groupHTML += `<button class="b3-menu__item" draggable="${disabledDrag ? "false" : "true"}" data-id="${item.id}">
     ${disabledDrag ? "" : '<svg class="b3-menu__icon fn__grab"><use xlink:href="#iconDrag"></use></svg>'}
     <div class="b3-menu__label fn__flex">${item.name || ""}</div>
-    <svg class="b3-menu__action" data-type="hideGroup" data-id="${item.id}"><use xlink:href="#iconEye${item.groupHidden === 0 ? "" : "off"}"></use></svg>
+    <svg class="b3-menu__action b3-menu__action--show" data-type="hideGroup" data-id="${item.id}"><use xlink:href="#iconEye${item.groupHidden === 0 ? "" : "off"}"></use></svg>
 </button>`;
             });
         }
diff --git a/app/src/protyle/render/av/openMenuPanel.ts b/app/src/protyle/render/av/openMenuPanel.ts
index 32d202948..97e618cf9 100644
--- a/app/src/protyle/render/av/openMenuPanel.ts
+++ b/app/src/protyle/render/av/openMenuPanel.ts
@@ -431,9 +431,8 @@ export const openMenuPanel = (options: {
                 }, options.cellElements);
                 return;
             }
-
             if (targetElement.getAttribute("data-type") === "editCol") {
-                const previousID = (targetElement.classList.contains("dragover__top") ? targetElement.previousElementSibling?.getAttribute("data-id") : targetElement.getAttribute("data-id")) || "";
+                const previousID = (isTop ? targetElement.previousElementSibling?.getAttribute("data-id") : targetElement.getAttribute("data-id")) || "";
                 const undoPreviousID = sourceElement.previousElementSibling?.getAttribute("data-id") || "";
                 if (previousID !== undoPreviousID && previousID !== sourceId) {
                     transaction(options.protyle, [{
@@ -470,6 +469,48 @@ export const openMenuPanel = (options: {
                 menuElement.innerHTML = getPropertiesHTML(fields);
                 return;
             }
+            if (targetElement.querySelector('[data-type="hideGroup"]')) {
+                const previousID = (isTop ? targetElement.previousElementSibling?.getAttribute("data-id") : targetElement.getAttribute("data-id")) || "";
+                const undoPreviousID = sourceElement.previousElementSibling?.getAttribute("data-id") || "";
+                if (previousID !== undoPreviousID && previousID !== sourceId) {
+                    transaction(options.protyle, [{
+                        action: "sortAttrViewGroup",
+                        avID,
+                        blockID,
+                        previousID,
+                        id: sourceId,
+                    }], [{
+                        action: "sortAttrViewGroup",
+                        avID,
+                        blockID,
+                        previousID: undoPreviousID,
+                        id: sourceId,
+                    }]);
+                    data.view.groups.find((group, index) => {
+                        if (group.id === sourceId) {
+                            const groupData = data.view.groups.splice(index, 1)[0];
+                            data.view.groups.find((item, index: number) => {
+                                if (item.id === targetId) {
+                                    if (isTop) {
+                                        data.view.groups.splice(index, 0, groupData);
+                                    } else {
+                                        data.view.groups.splice(index + 1, 0, groupData);
+                                    }
+                                    return true;
+                                }
+                            });
+                            return true;
+                        }
+                    });
+                    if (isTop) {
+                        targetElement.before(sourceElement);
+                    } else {
+                        targetElement.after(sourceElement);
+                    }
+                }
+                targetElement.classList.remove("dragover__top", "dragover__bottom");
+                return;
+            }
         });
         let dragoverElement: HTMLElement;
         avPanelElement.addEventListener("dragover", (event: DragEvent) => {
diff --git a/app/src/protyle/wysiwyg/transaction.ts b/app/src/protyle/wysiwyg/transaction.ts
index 2e3ee6c80..5c1eebe86 100644
--- a/app/src/protyle/wysiwyg/transaction.ts
+++ b/app/src/protyle/wysiwyg/transaction.ts
@@ -860,7 +860,7 @@ export const onTransaction = (protyle: IProtyle, operation: IOperation, isUndo:
         "updateAttrViewColRelation", "setAttrViewPageSize", "updateAttrViewColRollup", "sortAttrViewKey", "setAttrViewColDesc",
         "duplicateAttrViewKey", "setAttrViewViewDesc", "setAttrViewCoverFrom", "setAttrViewCoverFromAssetKeyID",
         "setAttrViewBlockView", "setAttrViewCardSize", "setAttrViewCardAspectRatio", "hideAttrViewName", "setAttrViewShowIcon",
-        "setAttrViewWrapField", "setAttrViewGroup", "removeAttrViewGroup", "hideAttrViewGroup"].includes(operation.action)) {
+        "setAttrViewWrapField", "setAttrViewGroup", "removeAttrViewGroup", "hideAttrViewGroup", "sortAttrViewGroup"].includes(operation.action)) {
         if (!isUndo) {
             // 撤销 transaction 会进行推送，需使用推送来进行刷新最新数据 https://github.com/siyuan-note/siyuan/issues/13607
             refreshAV(protyle, operation);
diff --git a/app/src/types/index.d.ts b/app/src/types/index.d.ts
index 284964f62..175290deb 100644
--- a/app/src/types/index.d.ts
+++ b/app/src/types/index.d.ts
@@ -67,6 +67,7 @@ type TOperation =
     | "removeAttrViewGroup"
     | "syncAttrViewTableColWidth"
     | "hideAttrViewGroup"
+    | "sortAttrViewGroup"
 type TBazaarType = "templates" | "icons" | "widgets" | "themes" | "plugins"
 type TCardType = "doc" | "notebook" | "all"
 type TEventBus = "ws-main" | "sync-start" | "sync-end" | "sync-fail" |