refs #1766 Introduce vue-virtual-scroll in Bookmarks
This commit is contained in:
parent
f480124e46
commit
e23f3c2ad4
|
@ -1,19 +1,23 @@
|
||||||
<template>
|
<template>
|
||||||
<div id="bookmarks" v-shortkey="shortcutEnabled ? { next: ['j'] } : {}" @shortkey="handleKey">
|
<div id="bookmarks" v-shortkey="shortcutEnabled ? { next: ['j'] } : {}" @shortkey="handleKey">
|
||||||
<div v-shortkey="{ linux: ['ctrl', 'r'], mac: ['meta', 'r'] }" @shortkey="reload()"></div>
|
<div v-shortkey="{ linux: ['ctrl', 'r'], mac: ['meta', 'r'] }" @shortkey="reload()"></div>
|
||||||
<div class="bookmark" v-for="message in bookmarks" v-bind:key="message.id">
|
<DynamicScroller :items="bookmarks" :min-item-size="60" class="scroller" page-mode>
|
||||||
<toot
|
<template v-slot="{ item, index, active }">
|
||||||
:message="message"
|
<DynamicScrollerItem :item="item" :active="active" :size-dependencies="[item.uri]" :data-index="index">
|
||||||
:focused="message.uri === focusedId"
|
<toot
|
||||||
:overlaid="modalOpened"
|
:message="item"
|
||||||
v-on:update="updateToot"
|
:focused="item.uri === focusedId"
|
||||||
v-on:delete="deleteToot"
|
:overlaid="modalOpened"
|
||||||
@focusNext="focusNext"
|
v-on:update="updateToot"
|
||||||
@focusPrev="focusPrev"
|
v-on:delete="deleteToot"
|
||||||
@focusRight="focusSidebar"
|
@focusNext="focusNext"
|
||||||
@selectToot="focusToot(message)"
|
@focusPrev="focusPrev"
|
||||||
></toot>
|
@focusRight="focusSidebar"
|
||||||
</div>
|
@selectToot="focusToot(item)"
|
||||||
|
></toot>
|
||||||
|
</DynamicScrollerItem>
|
||||||
|
</template>
|
||||||
|
</DynamicScroller>
|
||||||
<div class="loading-card" v-loading="lazyLoading" :element-loading-background="backgroundColor"></div>
|
<div class="loading-card" v-loading="lazyLoading" :element-loading-background="backgroundColor"></div>
|
||||||
<div :class="openSideBar ? 'upper-with-side-bar' : 'upper'" v-show="!heading">
|
<div :class="openSideBar ? 'upper-with-side-bar' : 'upper'" v-show="!heading">
|
||||||
<el-button type="primary" icon="el-icon-arrow-up" @click="upper" circle> </el-button>
|
<el-button type="primary" icon="el-icon-arrow-up" @click="upper" circle> </el-button>
|
||||||
|
|
Loading…
Reference in New Issue