From 3b25d3e3475c332f1f9ccbc947c63ff8a40e0e54 Mon Sep 17 00:00:00 2001
From: hayden <hayden.mike.zhang@gmail.com>
Date: Fri, 8 Nov 2024 12:42:00 +0800
Subject: [PATCH] pref: optimize the timing of scrollbar reset

---
 src/components/DialogManager.vue  | 9 ++++++++-
 src/components/ResponseScroll.vue | 2 +-
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/components/DialogManager.vue b/src/components/DialogManager.vue
index 721e0ec..9493e99 100644
--- a/src/components/DialogManager.vue
+++ b/src/components/DialogManager.vue
@@ -40,6 +40,7 @@
     </div>
 
     <ResponseScroll
+      ref="responseScroll"
       :items="list"
       :itemSize="itemSize"
       :row-key="(item) => item.map(genModelKey).join(',')"
@@ -80,7 +81,7 @@ import ModelCard from 'components/ModelCard.vue'
 import ResponseInput from 'components/ResponseInput.vue'
 import ResponseSelect from 'components/ResponseSelect.vue'
 import ResponseScroll from 'components/ResponseScroll.vue'
-import { computed, ref } from 'vue'
+import { computed, ref, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { chunk } from 'lodash'
 import { defineResizeCallback } from 'hooks/resize'
@@ -91,6 +92,8 @@ const { isMobile, cardWidth, gutter, aspect, modelFolders } = useConfig()
 const { data } = useModels()
 const { t } = useI18n()
 
+const responseScroll = ref()
+
 const searchContent = ref<string>()
 
 const currentType = ref('all')
@@ -120,6 +123,10 @@ const sortOrderOptions = ref(
   }),
 )
 
+watch([searchContent, currentType], () => {
+  responseScroll.value.init()
+})
+
 const itemSize = computed(() => {
   let itemWidth = cardWidth
   let itemGutter = gutter
diff --git a/src/components/ResponseScroll.vue b/src/components/ResponseScroll.vue
index 0b60689..57ceeec 100644
--- a/src/components/ResponseScroll.vue
+++ b/src/components/ResponseScroll.vue
@@ -298,7 +298,6 @@ const startDragThumb = (event: MouseEvent) => {
 watch(
   () => props.items,
   () => {
-    init()
     setSpacerSize()
     calculateScrollThumbSize()
     calculateLoadItems()
@@ -311,5 +310,6 @@ onUnmounted(() => {
 
 defineExpose({
   viewport,
+  init,
 })
 </script>