add BackToTopVirtual component

This commit is contained in:
pa
2026-01-25 17:08:25 +09:00
parent ddd191e332
commit 7e312a0e8c
5 changed files with 173 additions and 28 deletions

View File

@@ -79,6 +79,7 @@
</div>
</template>
</div>
<BackToTopVirtual :virtualizer="virtualizer" :target="scrollViewportRef" :teleport-to="scrollRootRef" />
</div>
</template>
@@ -101,6 +102,7 @@
import { isRealInstance, userImage, userStatusClass } from '../../../shared/utils';
import { getFriendsLocations } from '../../../shared/utils/location.js';
import BackToTopVirtual from '../../../components/BackToTopVirtual.vue';
import FriendItem from './FriendItem.vue';
import Location from '../../../components/Location.vue';
import configRepository from '../../../service/config';
@@ -127,6 +129,7 @@
const isSidebarGroupByInstanceCollapsed = ref(false);
const listRootRef = ref(null);
const scrollViewportRef = ref(null);
const scrollRootRef = ref(null);
loadFriendsGroupStates();
@@ -474,6 +477,7 @@
onMounted(() => {
scrollViewportRef.value = listRootRef.value?.closest('[data-slot="scroll-area-viewport"]') ?? null;
scrollRootRef.value = listRootRef.value?.closest('[data-slot="scroll-area"]') ?? null;
nextTick(() => {
virtualizer.value?.measure?.();
});

View File

@@ -45,6 +45,7 @@
</div>
</template>
</div>
<BackToTopVirtual :virtualizer="virtualizer" :target="scrollViewportRef" :teleport-to="scrollRootRef" />
</div>
</template>
@@ -57,6 +58,7 @@
import { useAppearanceSettingsStore, useGroupStore } from '../../../stores';
import { convertFileUrlToImageUrl } from '../../../shared/utils';
import BackToTopVirtual from '../../../components/BackToTopVirtual.vue';
import Location from '../../../components/Location.vue';
const { isAgeGatedInstancesVisible } = storeToRefs(useAppearanceSettingsStore());
@@ -66,6 +68,7 @@
const groupInstancesCfg = ref({});
const listRootRef = ref(null);
const scrollViewportRef = ref(null);
const scrollRootRef = ref(null);
const groupedGroupInstances = computed(() => {
const groupMap = new Map();
@@ -161,7 +164,6 @@
transform: `translateY(${item.virtualItem.start}px)`
});
function getSmallGroupIconUrl(url) {
return convertFileUrlToImageUrl(url);
}
@@ -176,6 +178,7 @@
onMounted(() => {
scrollViewportRef.value = listRootRef.value?.closest('[data-slot="scroll-area-viewport"]') ?? null;
scrollRootRef.value = listRootRef.value?.closest('[data-slot="scroll-area"]') ?? null;
nextTick(() => {
virtualizer.value?.measure?.();
});