This commit is contained in:
syuilo 2018-05-17 23:53:55 +09:00
parent 10a2db9160
commit fc2432785f
3 changed files with 20 additions and 9 deletions

View File

@ -1,7 +1,5 @@
<template>
<div class="mk-notes">
<div class="newer-indicator" :style="{ top: $store.state.uiHeaderHeight + 'px' }" v-show="queue.length > 0"></div>
<slot name="head"></slot>
<slot name="empty" v-if="notes.length == 0 && !fetching && requestInitPromise == null"></slot>
@ -71,6 +69,16 @@ export default Vue.extend({
}
},
watch: {
queue(x) {
if (x.length > 0) {
this.$store.commit('indicate', true);
} else {
this.$store.commit('indicate', false);
}
}
},
mounted() {
document.addEventListener('visibilitychange', this.onVisibilitychange, false);
window.addEventListener('scroll', this.onScroll);
@ -238,13 +246,6 @@ root(isDark)
[data-fa]
margin-right 8px
> .newer-indicator
position -webkit-sticky
position sticky
z-index 100
height 3px
background $theme-color
> .init
padding 64px 0
text-align center

View File

@ -13,6 +13,7 @@
<slot name="func"></slot>
</div>
</div>
<div class="indicator" v-show="$store.state.indicate"></div>
</div>
</template>
@ -156,6 +157,10 @@ root(isDark)
&, *
user-select none
> .indicator
height 3px
background $theme-color
> .main
color rgba(#fff, 0.9)

View File

@ -24,10 +24,15 @@ export default (os: MiOS) => new Vuex.Store({
}],
state: {
indicate: false,
uiHeaderHeight: 0
},
mutations: {
indicate(state, x) {
state.indicate = x;
},
setUiHeaderHeight(state, height) {
state.uiHeaderHeight = height;
}