Refactoring
This commit is contained in:
syuilo
parent
262d5ead51
commit
5511b6e013
41 changed files with 764 additions and 1408 deletions
|
|
@ -1,13 +1,11 @@
|
|||
<template>
|
||||
<x-notes ref="timeline" :make-promise="makePromise" @inited="() => $emit('loaded')"/>
|
||||
<x-notes ref="timeline" :pagination="pagination" @inited="() => $emit('loaded')"/>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import XNotes from './deck.notes.vue';
|
||||
|
||||
const fetchLimit = 10;
|
||||
|
||||
export default Vue.extend({
|
||||
components: {
|
||||
XNotes
|
||||
|
|
@ -16,27 +14,16 @@ export default Vue.extend({
|
|||
data() {
|
||||
return {
|
||||
connection: null,
|
||||
makePromise: cursor => this.$root.api('notes/mentions', {
|
||||
limit: fetchLimit + 1,
|
||||
untilId: cursor ? cursor : undefined,
|
||||
includeMyRenotes: this.$store.state.settings.showMyRenotes,
|
||||
includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
|
||||
includeLocalRenotes: this.$store.state.settings.showLocalRenotes,
|
||||
visibility: 'specified'
|
||||
}).then(notes => {
|
||||
if (notes.length == fetchLimit + 1) {
|
||||
notes.pop();
|
||||
return {
|
||||
notes: notes,
|
||||
more: true
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
notes: notes,
|
||||
more: false
|
||||
};
|
||||
pagination: {
|
||||
endpoint: 'notes/mentions',
|
||||
limit: 10,
|
||||
params: {
|
||||
includeMyRenotes: this.$store.state.settings.showMyRenotes,
|
||||
includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
|
||||
includeLocalRenotes: this.$store.state.settings.showLocalRenotes,
|
||||
visibility: 'specified'
|
||||
}
|
||||
})
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -1,58 +0,0 @@
|
|||
<template>
|
||||
<x-column>
|
||||
<template #header>
|
||||
<fa :icon="['fa', 'star']"/>{{ $t('@.favorites') }}
|
||||
</template>
|
||||
|
||||
<div>
|
||||
<x-notes ref="timeline" :make-promise="makePromise" @inited="() => $emit('loaded')"/>
|
||||
</div>
|
||||
</x-column>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import i18n from '../../../i18n';
|
||||
import XColumn from './deck.column.vue';
|
||||
import XNotes from './deck.notes.vue';
|
||||
|
||||
const fetchLimit = 10;
|
||||
|
||||
export default Vue.extend({
|
||||
i18n: i18n(),
|
||||
|
||||
components: {
|
||||
XColumn,
|
||||
XNotes,
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
makePromise: cursor => this.$root.api('i/favorites', {
|
||||
limit: fetchLimit + 1,
|
||||
untilId: cursor ? cursor : undefined,
|
||||
}).then(notes => {
|
||||
notes = notes.map(x => x.note);
|
||||
if (notes.length == fetchLimit + 1) {
|
||||
notes.pop();
|
||||
return {
|
||||
notes: notes,
|
||||
more: true
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
notes: notes,
|
||||
more: false
|
||||
};
|
||||
}
|
||||
})
|
||||
};
|
||||
},
|
||||
|
||||
methods: {
|
||||
focus() {
|
||||
this.$refs.timeline.focus();
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
<template>
|
||||
<x-column>
|
||||
<template #header>
|
||||
<fa :icon="faNewspaper"/>{{ $t('@.featured-notes') }}
|
||||
</template>
|
||||
|
||||
<div>
|
||||
<x-notes ref="timeline" :make-promise="makePromise" @inited="() => $emit('loaded')"/>
|
||||
</div>
|
||||
</x-column>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import i18n from '../../../i18n';
|
||||
import XColumn from './deck.column.vue';
|
||||
import XNotes from './deck.notes.vue';
|
||||
import { faNewspaper } from '@fortawesome/free-solid-svg-icons';
|
||||
|
||||
export default Vue.extend({
|
||||
i18n: i18n(),
|
||||
|
||||
components: {
|
||||
XColumn,
|
||||
XNotes,
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
faNewspaper,
|
||||
makePromise: cursor => this.$root.api('notes/featured', {
|
||||
limit: 30,
|
||||
}).then(notes => {
|
||||
notes.sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime());
|
||||
return notes;
|
||||
})
|
||||
};
|
||||
},
|
||||
|
||||
methods: {
|
||||
focus() {
|
||||
this.$refs.timeline.focus();
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
|
@ -1,13 +1,11 @@
|
|||
<template>
|
||||
<x-notes ref="timeline" :make-promise="makePromise" @inited="() => $emit('loaded')"/>
|
||||
<x-notes ref="timeline" :pagination="pagination" @inited="() => $emit('loaded')"/>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import XNotes from './deck.notes.vue';
|
||||
|
||||
const fetchLimit = 10;
|
||||
|
||||
export default Vue.extend({
|
||||
components: {
|
||||
XNotes
|
||||
|
|
@ -28,28 +26,18 @@ export default Vue.extend({
|
|||
data() {
|
||||
return {
|
||||
connection: null,
|
||||
makePromise: cursor => this.$root.api('notes/search-by-tag', {
|
||||
limit: fetchLimit + 1,
|
||||
untilId: cursor ? cursor : undefined,
|
||||
withFiles: this.mediaOnly,
|
||||
includeMyRenotes: this.$store.state.settings.showMyRenotes,
|
||||
includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
|
||||
includeLocalRenotes: this.$store.state.settings.showLocalRenotes,
|
||||
query: this.tagTl.query
|
||||
}).then(notes => {
|
||||
if (notes.length == fetchLimit + 1) {
|
||||
notes.pop();
|
||||
return {
|
||||
notes: notes,
|
||||
more: true
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
notes: notes,
|
||||
more: false
|
||||
};
|
||||
}
|
||||
})
|
||||
pagination: {
|
||||
endpoint: 'notes/search-by-tag',
|
||||
limit: 10,
|
||||
params: init => ({
|
||||
untilDate: init ? undefined : (this.date ? this.date.getTime() : undefined),
|
||||
withFiles: this.mediaOnly,
|
||||
includeMyRenotes: this.$store.state.settings.showMyRenotes,
|
||||
includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
|
||||
includeLocalRenotes: this.$store.state.settings.showLocalRenotes,
|
||||
query: this.tagTl.query
|
||||
})
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -1,13 +1,11 @@
|
|||
<template>
|
||||
<x-notes ref="timeline" :make-promise="makePromise" @inited="() => $emit('loaded')"/>
|
||||
<x-notes ref="timeline" :pagination="pagination" @inited="() => $emit('loaded')"/>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import XNotes from './deck.notes.vue';
|
||||
|
||||
const fetchLimit = 10;
|
||||
|
||||
export default Vue.extend({
|
||||
components: {
|
||||
XNotes
|
||||
|
|
@ -28,28 +26,18 @@ export default Vue.extend({
|
|||
data() {
|
||||
return {
|
||||
connection: null,
|
||||
makePromise: cursor => this.$root.api('notes/user-list-timeline', {
|
||||
listId: this.list.id,
|
||||
limit: fetchLimit + 1,
|
||||
untilId: cursor ? cursor : undefined,
|
||||
withFiles: this.mediaOnly,
|
||||
includeMyRenotes: this.$store.state.settings.showMyRenotes,
|
||||
includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
|
||||
includeLocalRenotes: this.$store.state.settings.showLocalRenotes
|
||||
}).then(notes => {
|
||||
if (notes.length == fetchLimit + 1) {
|
||||
notes.pop();
|
||||
return {
|
||||
notes: notes,
|
||||
more: true
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
notes: notes,
|
||||
more: false
|
||||
};
|
||||
}
|
||||
})
|
||||
pagination: {
|
||||
endpoint: 'notes/user-list-timeline',
|
||||
limit: 10,
|
||||
params: init => ({
|
||||
listId: this.list.id,
|
||||
untilDate: init ? undefined : (this.date ? this.date.getTime() : undefined),
|
||||
withFiles: this.mediaOnly,
|
||||
includeMyRenotes: this.$store.state.settings.showMyRenotes,
|
||||
includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
|
||||
includeLocalRenotes: this.$store.state.settings.showLocalRenotes
|
||||
})
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -1,13 +1,11 @@
|
|||
<template>
|
||||
<x-notes ref="timeline" :make-promise="makePromise" @inited="() => $emit('loaded')"/>
|
||||
<x-notes ref="timeline" :pagination="pagination" @inited="() => $emit('loaded')"/>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import XNotes from './deck.notes.vue';
|
||||
|
||||
const fetchLimit = 10;
|
||||
|
||||
export default Vue.extend({
|
||||
components: {
|
||||
XNotes
|
||||
|
|
@ -16,26 +14,16 @@ export default Vue.extend({
|
|||
data() {
|
||||
return {
|
||||
connection: null,
|
||||
makePromise: cursor => this.$root.api('notes/mentions', {
|
||||
limit: fetchLimit + 1,
|
||||
untilId: cursor ? cursor : undefined,
|
||||
includeMyRenotes: this.$store.state.settings.showMyRenotes,
|
||||
includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
|
||||
includeLocalRenotes: this.$store.state.settings.showLocalRenotes
|
||||
}).then(notes => {
|
||||
if (notes.length == fetchLimit + 1) {
|
||||
notes.pop();
|
||||
return {
|
||||
notes: notes,
|
||||
more: true
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
notes: notes,
|
||||
more: false
|
||||
};
|
||||
}
|
||||
})
|
||||
pagination: {
|
||||
endpoint: 'notes/mentions',
|
||||
limit: 10,
|
||||
params: init => ({
|
||||
untilDate: init ? undefined : (this.date ? this.date.getTime() : undefined),
|
||||
includeMyRenotes: this.$store.state.settings.showMyRenotes,
|
||||
includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
|
||||
includeLocalRenotes: this.$store.state.settings.showLocalRenotes
|
||||
})
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<div class="eamppglmnmimdhrlzhplwpvyeaqmmhxu">
|
||||
<div class="empty" v-if="notes.length == 0 && !fetching && inited">{{ $t('@.no-notes') }}</div>
|
||||
<div class="empty" v-if="empty">{{ $t('@.no-notes') }}</div>
|
||||
|
||||
<mk-error v-if="!fetching && !inited" @retry="init()"/>
|
||||
<mk-error v-if="error" @retry="init()"/>
|
||||
|
||||
<div class="placeholder" v-if="fetching">
|
||||
<template v-for="i in 10">
|
||||
|
|
@ -16,7 +16,6 @@
|
|||
<mk-note
|
||||
:note="note"
|
||||
:key="note.id"
|
||||
@update:note="onNoteUpdated(i, $event)"
|
||||
:compact="true"
|
||||
/>
|
||||
<p class="date" :key="note.id + '_date'" v-if="i != notes.length - 1 && note._date != _notes[i + 1]._date">
|
||||
|
|
@ -39,33 +38,47 @@
|
|||
import Vue from 'vue';
|
||||
import i18n from '../../../i18n';
|
||||
import shouldMuteNote from '../../../common/scripts/should-mute-note';
|
||||
|
||||
const displayLimit = 20;
|
||||
import paging from '../../../common/scripts/paging';
|
||||
|
||||
export default Vue.extend({
|
||||
i18n: i18n(),
|
||||
|
||||
inject: ['column', 'isScrollTop', 'count'],
|
||||
|
||||
mixins: [
|
||||
paging({
|
||||
displayLimit: 20,
|
||||
|
||||
onQueueChanged: (self, q) => {
|
||||
self.count(q.length);
|
||||
},
|
||||
|
||||
onPrepend: (self, note, silent) => {
|
||||
// 弾く
|
||||
if (shouldMuteNote(self.$store.state.i, self.$store.state.settings, note)) return false;
|
||||
|
||||
// タブが非表示またはスクロール位置が最上部ではないならタイトルで通知
|
||||
if (document.hidden || !self.isScrollTop()) {
|
||||
self.$store.commit('pushBehindNote', note);
|
||||
}
|
||||
}
|
||||
}),
|
||||
],
|
||||
|
||||
props: {
|
||||
makePromise: {
|
||||
pagination: {
|
||||
required: true
|
||||
},
|
||||
extract: {
|
||||
required: false
|
||||
}
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
rootEl: null,
|
||||
notes: [],
|
||||
queue: [],
|
||||
fetching: true,
|
||||
moreFetching: false,
|
||||
inited: false,
|
||||
more: false
|
||||
};
|
||||
},
|
||||
|
||||
computed: {
|
||||
notes() {
|
||||
return this.extract ? this.extract(this.items) : this.items;
|
||||
},
|
||||
|
||||
_notes(): any[] {
|
||||
return (this.notes as any).map(note => {
|
||||
const date = new Date(note.createdAt).getDate();
|
||||
|
|
@ -77,15 +90,6 @@ export default Vue.extend({
|
|||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
queue(q) {
|
||||
this.count(q.length);
|
||||
},
|
||||
makePromise() {
|
||||
this.init();
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
this.column.$on('top', this.onTop);
|
||||
this.column.$on('bottom', this.onBottom);
|
||||
|
|
@ -101,87 +105,6 @@ export default Vue.extend({
|
|||
focus() {
|
||||
(this.$refs.notes as any).children[0].focus ? (this.$refs.notes as any).children[0].focus() : (this.$refs.notes as any).$el.children[0].focus();
|
||||
},
|
||||
|
||||
onNoteUpdated(i, note) {
|
||||
Vue.set((this as any).notes, i, note);
|
||||
},
|
||||
|
||||
reload() {
|
||||
this.init();
|
||||
},
|
||||
|
||||
async init() {
|
||||
this.queue = [];
|
||||
this.notes = [];
|
||||
this.fetching = true;
|
||||
await (this.makePromise()).then(x => {
|
||||
if (Array.isArray(x)) {
|
||||
this.notes = x;
|
||||
} else {
|
||||
this.notes = x.notes;
|
||||
this.more = x.more;
|
||||
}
|
||||
this.inited = true;
|
||||
this.fetching = false;
|
||||
this.$emit('inited');
|
||||
}, e => {
|
||||
this.fetching = false;
|
||||
});
|
||||
},
|
||||
|
||||
async fetchMore() {
|
||||
if (!this.more || this.moreFetching) return;
|
||||
this.moreFetching = true;
|
||||
await (this.makePromise(this.notes[this.notes.length - 1].id)).then(x => {
|
||||
this.notes = this.notes.concat(x.notes);
|
||||
this.more = x.more;
|
||||
this.moreFetching = false;
|
||||
}, e => {
|
||||
this.moreFetching = false;
|
||||
});
|
||||
},
|
||||
|
||||
prepend(note, silent = false) {
|
||||
// 弾く
|
||||
if (shouldMuteNote(this.$store.state.i, this.$store.state.settings, note)) return;
|
||||
|
||||
// タブが非表示ならタイトルで通知
|
||||
if (document.hidden) {
|
||||
this.$store.commit('pushBehindNote', note);
|
||||
}
|
||||
|
||||
if (this.isScrollTop()) {
|
||||
// Prepend the note
|
||||
this.notes.unshift(note);
|
||||
|
||||
// オーバーフローしたら古い投稿は捨てる
|
||||
if (this.notes.length >= displayLimit) {
|
||||
this.notes = this.notes.slice(0, displayLimit);
|
||||
this.more = true;
|
||||
}
|
||||
} else {
|
||||
this.queue.push(note);
|
||||
}
|
||||
},
|
||||
|
||||
append(note) {
|
||||
this.notes.push(note);
|
||||
},
|
||||
|
||||
releaseQueue() {
|
||||
for (const n of this.queue) {
|
||||
this.prepend(n, true);
|
||||
}
|
||||
this.queue = [];
|
||||
},
|
||||
|
||||
onTop() {
|
||||
this.releaseQueue();
|
||||
},
|
||||
|
||||
onBottom() {
|
||||
this.fetchMore();
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -81,15 +81,15 @@
|
|||
</div>
|
||||
|
||||
<template v-if="notification.type == 'quote'">
|
||||
<mk-note :note="notification.note" @update:note="onNoteUpdated"/>
|
||||
<mk-note :note="notification.note"/>
|
||||
</template>
|
||||
|
||||
<template v-if="notification.type == 'reply'">
|
||||
<mk-note :note="notification.note" @update:note="onNoteUpdated"/>
|
||||
<mk-note :note="notification.note"/>
|
||||
</template>
|
||||
|
||||
<template v-if="notification.type == 'mention'">
|
||||
<mk-note :note="notification.note" @update:note="onNoteUpdated"/>
|
||||
<mk-note :note="notification.note"/>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -105,17 +105,6 @@ export default Vue.extend({
|
|||
getNoteSummary
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
onNoteUpdated(note) {
|
||||
switch (this.notification.type) {
|
||||
case 'quote':
|
||||
case 'reply':
|
||||
case 'mention':
|
||||
Vue.set(this.notification, 'note', note);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
</template>
|
||||
|
||||
<div>
|
||||
<x-notes ref="timeline" :make-promise="makePromise" @inited="() => $emit('loaded')"/>
|
||||
<x-notes ref="timeline" :pagination="pagination" @inited="() => $emit('loaded')"/>
|
||||
</div>
|
||||
</x-column>
|
||||
</template>
|
||||
|
|
@ -16,8 +16,6 @@ import XColumn from './deck.column.vue';
|
|||
import XNotes from './deck.notes.vue';
|
||||
import { genSearchQuery } from '../../../common/scripts/gen-search-query';
|
||||
|
||||
const limit = 20;
|
||||
|
||||
export default Vue.extend({
|
||||
components: {
|
||||
XColumn,
|
||||
|
|
@ -26,24 +24,11 @@ export default Vue.extend({
|
|||
|
||||
data() {
|
||||
return {
|
||||
makePromise: async cursor => this.$root.api('notes/search', {
|
||||
limit: limit + 1,
|
||||
offset: cursor ? cursor : undefined,
|
||||
...(await genSearchQuery(this, this.q))
|
||||
}).then(notes => {
|
||||
if (notes.length == limit + 1) {
|
||||
notes.pop();
|
||||
return {
|
||||
notes: notes,
|
||||
cursor: cursor ? cursor + limit : limit
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
notes: notes,
|
||||
more: false
|
||||
};
|
||||
}
|
||||
})
|
||||
pagination: {
|
||||
endpoint: 'notes/search',
|
||||
limit: 20,
|
||||
params: () => genSearchQuery(this, this.q)
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
</p>
|
||||
<p class="desc">{{ $t('disabled-timeline.description') }}</p>
|
||||
</div>
|
||||
<x-notes v-else ref="timeline" :make-promise="makePromise" @inited="() => $emit('loaded')"/>
|
||||
<x-notes v-else ref="timeline" :pagination="pagination" @inited="() => $emit('loaded')"/>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
|
|
@ -15,8 +15,6 @@ import XNotes from './deck.notes.vue';
|
|||
import { faMinusCircle } from '@fortawesome/free-solid-svg-icons';
|
||||
import i18n from '../../../i18n';
|
||||
|
||||
const fetchLimit = 10;
|
||||
|
||||
export default Vue.extend({
|
||||
i18n: i18n('deck'),
|
||||
|
||||
|
|
@ -42,7 +40,7 @@ export default Vue.extend({
|
|||
connection: null,
|
||||
disabled: false,
|
||||
faMinusCircle,
|
||||
makePromise: null
|
||||
pagination: null
|
||||
};
|
||||
},
|
||||
|
||||
|
|
@ -73,27 +71,17 @@ export default Vue.extend({
|
|||
},
|
||||
|
||||
created() {
|
||||
this.makePromise = cursor => this.$root.api(this.endpoint, {
|
||||
limit: fetchLimit + 1,
|
||||
untilId: cursor ? cursor : undefined,
|
||||
withFiles: this.mediaOnly,
|
||||
includeMyRenotes: this.$store.state.settings.showMyRenotes,
|
||||
includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
|
||||
includeLocalRenotes: this.$store.state.settings.showLocalRenotes
|
||||
}).then(notes => {
|
||||
if (notes.length == fetchLimit + 1) {
|
||||
notes.pop();
|
||||
return {
|
||||
notes: notes,
|
||||
more: true
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
notes: notes,
|
||||
more: false
|
||||
};
|
||||
}
|
||||
});
|
||||
this.pagination = {
|
||||
endpoint: this.endpoint,
|
||||
limit: 10,
|
||||
params: init => ({
|
||||
untilDate: init ? undefined : (this.date ? this.date.getTime() : undefined),
|
||||
withFiles: this.mediaOnly,
|
||||
includeMyRenotes: this.$store.state.settings.showMyRenotes,
|
||||
includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
|
||||
includeLocalRenotes: this.$store.state.settings.showLocalRenotes
|
||||
})
|
||||
};
|
||||
},
|
||||
|
||||
mounted() {
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@
|
|||
<ui-container>
|
||||
<template #header><fa :icon="['far', 'comment-alt']"/> {{ $t('timeline') }}</template>
|
||||
<div>
|
||||
<x-notes ref="timeline" :make-promise="makePromise" @inited="() => $emit('loaded')"/>
|
||||
<x-notes ref="timeline" :pagination="pagination" @inited="() => $emit('loaded')"/>
|
||||
</div>
|
||||
</ui-container>
|
||||
</div>
|
||||
|
|
@ -43,8 +43,6 @@ import XNotes from './deck.notes.vue';
|
|||
import { concat } from '../../../../../prelude/array';
|
||||
import ApexCharts from 'apexcharts';
|
||||
|
||||
const fetchLimit = 10;
|
||||
|
||||
export default Vue.extend({
|
||||
i18n: i18n('deck/deck.user-column.vue'),
|
||||
|
||||
|
|
@ -63,49 +61,38 @@ export default Vue.extend({
|
|||
return {
|
||||
withFiles: false,
|
||||
images: [],
|
||||
makePromise: null,
|
||||
chart: null as ApexCharts
|
||||
};
|
||||
},
|
||||
|
||||
computed: {
|
||||
pagination() {
|
||||
return {
|
||||
endpoint: 'users/notes',
|
||||
limit: 10,
|
||||
params: init => ({
|
||||
userId: this.user.id,
|
||||
untilDate: init ? undefined : (this.date ? this.date.getTime() : undefined),
|
||||
withFiles: this.withFiles,
|
||||
includeMyRenotes: this.$store.state.settings.showMyRenotes,
|
||||
includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
|
||||
includeLocalRenotes: this.$store.state.settings.showLocalRenotes
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
user() {
|
||||
this.fetch();
|
||||
this.genPromiseMaker();
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
this.fetch();
|
||||
this.genPromiseMaker();
|
||||
},
|
||||
|
||||
methods: {
|
||||
genPromiseMaker() {
|
||||
this.makePromise = cursor => this.$root.api('users/notes', {
|
||||
userId: this.user.id,
|
||||
limit: fetchLimit + 1,
|
||||
untilId: cursor ? cursor : undefined,
|
||||
withFiles: this.withFiles,
|
||||
includeMyRenotes: this.$store.state.settings.showMyRenotes,
|
||||
includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes,
|
||||
includeLocalRenotes: this.$store.state.settings.showLocalRenotes
|
||||
}).then(notes => {
|
||||
if (notes.length == fetchLimit + 1) {
|
||||
notes.pop();
|
||||
return {
|
||||
notes: notes,
|
||||
more: true
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
notes: notes,
|
||||
more: false
|
||||
};
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
fetch() {
|
||||
const image = [
|
||||
'image/jpeg',
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue