From 9169d877679c0da94cde40c1ae833211d5a7d2a2 Mon Sep 17 00:00:00 2001
From: Baobhan Sith <80159437+Heavrnl@users.noreply.github.com>
Date: Wed, 30 Apr 2025 14:12:39 +0800
Subject: [PATCH] update

---
 .../frontend/src/views/CommandHistoryView.vue   | 15 +++++----------
 .../frontend/src/views/QuickCommandsView.vue    | 17 +++++------------
 2 files changed, 10 insertions(+), 22 deletions(-)

diff --git a/packages/frontend/src/views/CommandHistoryView.vue b/packages/frontend/src/views/CommandHistoryView.vue
index 095921c..551862c 100644
--- a/packages/frontend/src/views/CommandHistoryView.vue
+++ b/packages/frontend/src/views/CommandHistoryView.vue
@@ -131,16 +131,11 @@ const scrollToSelected = async (index: number) => { // Accept index as argument
   const selectedItem = listElement.children[index] as HTMLLIElement;
 
   if (selectedItem) {
-    const listRect = listElement.getBoundingClientRect();
-    const itemRect = selectedItem.getBoundingClientRect();
-
-    if (itemRect.top < listRect.top) {
-      // Item is above the visible area
-      listElement.scrollTop -= listRect.top - itemRect.top;
-    } else if (itemRect.bottom > listRect.bottom) {
-      // Item is below the visible area
-      listElement.scrollTop += itemRect.bottom - listRect.bottom;
-    }
+    // 使用 scrollIntoView 使元素可见，滚动最小距离
+    selectedItem.scrollIntoView({
+      behavior: 'smooth', // 可以使用 'auto' 来实现即时滚动
+      block: 'nearest',
+    });
   }
 };
 
diff --git a/packages/frontend/src/views/QuickCommandsView.vue b/packages/frontend/src/views/QuickCommandsView.vue
index b528b1c..54d145e 100644
--- a/packages/frontend/src/views/QuickCommandsView.vue
+++ b/packages/frontend/src/views/QuickCommandsView.vue
@@ -149,18 +149,11 @@ const scrollToSelected = async (index: number) => { // Accept index as argument
   const selectedItem = listElement.children[index] as HTMLLIElement;
 
   if (selectedItem) {
-    const listRect = listElement.getBoundingClientRect();
-    const itemRect = selectedItem.getBoundingClientRect();
-
-    if (itemRect.top < listRect.top) {
-      // Item is above the visible area
-      listElement.scrollTop -= listRect.top - itemRect.top;
-    } else if (itemRect.bottom > listRect.bottom) {
-      // Item is below the visible area
-      listElement.scrollTop += itemRect.bottom - listRect.bottom;
-    }
-    // For smooth scrolling (optional):
-    // selectedItem.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
+    // 使用 scrollIntoView 使元素可见，滚动最小距离
+    selectedItem.scrollIntoView({
+      behavior: 'smooth', // 可以使用 'auto' 来实现即时滚动
+      block: 'nearest',
+    });
   }
 };