github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-05-15 01:33:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

Testing for edge cases

Browse Source
This commit is contained in:
Peter Olu 2022-04-28 04:37:30 +01:00
parent c09f46f242
commit 6b6cee2451
1 changed files with 5 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/FullVue.vue
View File

@ -16,7 +16,7 @@ limitations under the License. -->
<div ref="scrollWrapRef" class="scroll-snap-container"> <div ref="scrollWrapRef" class="scroll-snap-container">
<div v-if="items.length > 1" class="scroll-handler__wrapper"> <div v-if="items.length > 1" class="scroll-handler__wrapper">
<div <div
@click="scrollToGraph(item.i)" @click="scrollToGraph(item.i, index)"
v-for="(item, index) in items" v-for="(item, index) in items"
:key="item.i" :key="item.i"
:class="[currentItem === index ? 'active' : '']" :class="[currentItem === index ? 'active' : '']"
@ -69,8 +69,9 @@ export default defineComponent({
}, 500); }, 500);
} }
); );
function scrollToGraph(e: any) { function scrollToGraph(e: any, index: number) {
document?.getElementById(`item${e}`)?.scrollIntoView(); document?.getElementById(`item${e}`)?.scrollIntoView();
currentItem.value = index;
} }
function observeItems() { function observeItems() {
const observer = new IntersectionObserver((entries) => { const observer = new IntersectionObserver((entries) => {
@ -109,7 +110,7 @@ export default defineComponent({
} else if (currentItem.value === arrayOfItems?.value?.length - 1) { } else if (currentItem.value === arrayOfItems?.value?.length - 1) {
isScrolling.value = false; isScrolling.value = false;
currentItem.value = 0; currentItem.value = 0;
scrollTo(currentItem.value); scrollWrapRef.value?.scrollTo(0,0)
} }
} }
function initScroller() { function initScroller() {
@ -123,7 +124,7 @@ export default defineComponent({
scrollDown(); scrollDown();
// scrollDown // scrollDown
} }
} }
}); });
} }
onMounted(() => { onMounted(() => {