From ecf2f6a7b14c940c5f25e3d3f4ca761c6edee0df Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8E=E8=82=96=E7=A3=8A?= <18851179580@163.com>
Date: Mon, 13 Jan 2025 16:25:19 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=8E=86=E5=8F=B2=E8=AE=B0?=
 =?UTF-8?q?=E5=BD=95=E6=BB=9A=E5=8A=A8=E6=95=88=E6=9E=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/top-side-operation/index.vue   | 22 ++++++++++---------
 1 file changed, 12 insertions(+), 10 deletions(-)

diff --git a/src/components/model-custom/components/top-side-operation/index.vue b/src/components/model-custom/components/top-side-operation/index.vue
index 8d69a4f3..1db9bb47 100644
--- a/src/components/model-custom/components/top-side-operation/index.vue
+++ b/src/components/model-custom/components/top-side-operation/index.vue
@@ -15,7 +15,7 @@
         </div>
         <el-dialog v-model="dialogVisible" class="history-dialog" :style="{ top: '80px', left: dialog_left + 'px' }" title="历史记录" width="200" draggable show-close :modal="false" :close-on-click-modal="false" :close-on-press-escape="false">
             <div ref="historyDialog" class="history-dialog-content flex-col gap-14">
-                <div v-for="(item, index1) in history_list" :key="index1" :class="[`history-dialog-item ${props.configType}`, {'active': records_index == index1, }]" @click="handleHistory(index1, records_index !== index1)">
+                <div v-for="(item, index1) in history_list" :key="index1" :class="[`history-dialog-item ${props.configType}`, {'active': records_index == index1 }]" @click="handleHistory(index1, records_index !== index1)">
                     <div class="history-dialog-item-title">{{ item.name }}</div>
                     <el-icon v-if="records_index == index1" class="iconfont icon-checked size-14" />
                 </div>
@@ -65,16 +65,18 @@ watchEffect(() => {
         history_list.value = dataSourceStore.custom_group_records;
         records_index.value = dataSourceStore.custom_group_records_index;
     }
-    // 获取当前选中的内容 --中间区域的滚动效果
-    const activeCard: HTMLElement | null = document.querySelector(`.history-dialog-item.active.${props.configType}`);
-    if (activeCard) {
-        // 获取选中内容的位置
-        const scrollY = activeCard.offsetTop;
-        if (historyDialog.value) {
-            // 选中的滚动到指定位置
-            historyDialog.value.scrollTo({ top: scrollY - 100, behavior: 'smooth' });
+    nextTick(() => {
+        // 获取当前选中的内容 --中间区域的滚动效果
+        const activeCard: HTMLElement | null = document.querySelector(`.history-dialog-item.active.${props.configType}`);
+        if (activeCard) {
+            // 获取选中内容的位置
+            const scrollY = activeCard.offsetTop;
+            if (historyDialog.value) {
+                // 选中的滚动到指定位置
+                historyDialog.value.scrollTo({ top: scrollY - 100, behavior: 'smooth' });
+            }
         }
-    }
+    });
 });
 const emits = defineEmits(['back', 'forward', 'handleHistory']);