mirror of
https://activitypub.software/TransFem-org/Sharkey.git
synced 2024-12-15 17:35:44 +01:00
✌️
This commit is contained in:
parent
2fbd7ff3c6
commit
9a569fb30c
4 changed files with 58 additions and 16 deletions
|
@ -18,6 +18,7 @@ import notifications from './notifications.vue';
|
||||||
import notificationPreview from './notification-preview.vue';
|
import notificationPreview from './notification-preview.vue';
|
||||||
import usersList from './users-list.vue';
|
import usersList from './users-list.vue';
|
||||||
import userPreview from './user-preview.vue';
|
import userPreview from './user-preview.vue';
|
||||||
|
import userTimeline from './user-timeline.vue';
|
||||||
|
|
||||||
Vue.component('mk-ui', ui);
|
Vue.component('mk-ui', ui);
|
||||||
Vue.component('mk-home', home);
|
Vue.component('mk-home', home);
|
||||||
|
@ -37,3 +38,4 @@ Vue.component('mk-notifications', notifications);
|
||||||
Vue.component('mk-notification-preview', notificationPreview);
|
Vue.component('mk-notification-preview', notificationPreview);
|
||||||
Vue.component('mk-users-list', usersList);
|
Vue.component('mk-users-list', usersList);
|
||||||
Vue.component('mk-user-preview', userPreview);
|
Vue.component('mk-user-preview', userPreview);
|
||||||
|
Vue.component('mk-user-timeline', userTimeline);
|
||||||
|
|
|
@ -9,9 +9,9 @@
|
||||||
%fa:R comments%
|
%fa:R comments%
|
||||||
%i18n:mobile.tags.mk-home-timeline.empty-timeline%
|
%i18n:mobile.tags.mk-home-timeline.empty-timeline%
|
||||||
</div>
|
</div>
|
||||||
<button v-if="!fetching && posts.length != 0" @click="more" :disabled="fetching" slot="tail">
|
<button v-if="!fetching && existMore" @click="more" :disabled="moreFetching" slot="tail">
|
||||||
<span v-if="!fetching">%i18n:mobile.tags.mk-timeline.load-more%</span>
|
<span v-if="!moreFetching">%i18n:mobile.tags.mk-timeline.load-more%</span>
|
||||||
<span v-if="fetching">%i18n:common.loading%<mk-ellipsis/></span>
|
<span v-if="moreFetching">%i18n:common.loading%<mk-ellipsis/></span>
|
||||||
</button>
|
</button>
|
||||||
</mk-posts>
|
</mk-posts>
|
||||||
</div>
|
</div>
|
||||||
|
@ -19,6 +19,9 @@
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import Vue from 'vue';
|
import Vue from 'vue';
|
||||||
|
|
||||||
|
const limit = 10;
|
||||||
|
|
||||||
export default Vue.extend({
|
export default Vue.extend({
|
||||||
props: {
|
props: {
|
||||||
date: {
|
date: {
|
||||||
|
@ -31,6 +34,7 @@ export default Vue.extend({
|
||||||
fetching: true,
|
fetching: true,
|
||||||
moreFetching: false,
|
moreFetching: false,
|
||||||
posts: [],
|
posts: [],
|
||||||
|
existMore: false,
|
||||||
connection: null,
|
connection: null,
|
||||||
connectionId: null
|
connectionId: null
|
||||||
};
|
};
|
||||||
|
@ -59,10 +63,14 @@ export default Vue.extend({
|
||||||
methods: {
|
methods: {
|
||||||
fetch(cb?) {
|
fetch(cb?) {
|
||||||
this.fetching = true;
|
this.fetching = true;
|
||||||
|
|
||||||
(this as any).api('posts/timeline', {
|
(this as any).api('posts/timeline', {
|
||||||
|
limit: limit + 1,
|
||||||
until_date: this.date ? (this.date as any).getTime() : undefined
|
until_date: this.date ? (this.date as any).getTime() : undefined
|
||||||
}).then(posts => {
|
}).then(posts => {
|
||||||
|
if (posts.length == limit + 1) {
|
||||||
|
posts.pop();
|
||||||
|
this.existMore = true;
|
||||||
|
}
|
||||||
this.posts = posts;
|
this.posts = posts;
|
||||||
this.fetching = false;
|
this.fetching = false;
|
||||||
this.$emit('loaded');
|
this.$emit('loaded');
|
||||||
|
@ -70,11 +78,17 @@ export default Vue.extend({
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
more() {
|
more() {
|
||||||
if (this.moreFetching || this.fetching || this.posts.length == 0) return;
|
|
||||||
this.moreFetching = true;
|
this.moreFetching = true;
|
||||||
(this as any).api('posts/timeline', {
|
(this as any).api('posts/timeline', {
|
||||||
|
limit: limit + 1,
|
||||||
until_id: this.posts[this.posts.length - 1].id
|
until_id: this.posts[this.posts.length - 1].id
|
||||||
}).then(posts => {
|
}).then(posts => {
|
||||||
|
if (posts.length == limit + 1) {
|
||||||
|
posts.pop();
|
||||||
|
this.existMore = true;
|
||||||
|
} else {
|
||||||
|
this.existMore = false;
|
||||||
|
}
|
||||||
this.posts = this.posts.concat(posts);
|
this.posts = this.posts.concat(posts);
|
||||||
this.moreFetching = false;
|
this.moreFetching = false;
|
||||||
});
|
});
|
||||||
|
|
|
@ -8,9 +8,9 @@
|
||||||
%fa:R comments%
|
%fa:R comments%
|
||||||
{{ withMedia ? '%i18n:mobile.tags.mk-user-timeline.no-posts-with-media%' : '%i18n:mobile.tags.mk-user-timeline.no-posts%' }}
|
{{ withMedia ? '%i18n:mobile.tags.mk-user-timeline.no-posts-with-media%' : '%i18n:mobile.tags.mk-user-timeline.no-posts%' }}
|
||||||
</div>
|
</div>
|
||||||
<button v-if="canFetchMore" @click="more" :disabled="fetching" slot="tail">
|
<button v-if="!fetching && existMore" @click="more" :disabled="moreFetching" slot="tail">
|
||||||
<span v-if="!fetching">%i18n:mobile.tags.mk-user-timeline.load-more%</span>
|
<span v-if="!moreFetching">%i18n:mobile.tags.mk-user-timeline.load-more%</span>
|
||||||
<span v-if="fetching">%i18n:common.loading%<mk-ellipsis/></span>
|
<span v-if="moreFetching">%i18n:common.loading%<mk-ellipsis/></span>
|
||||||
</button>
|
</button>
|
||||||
</mk-posts>
|
</mk-posts>
|
||||||
</div>
|
</div>
|
||||||
|
@ -18,23 +18,53 @@
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import Vue from 'vue';
|
import Vue from 'vue';
|
||||||
|
|
||||||
|
const limit = 10;
|
||||||
|
|
||||||
export default Vue.extend({
|
export default Vue.extend({
|
||||||
props: ['user', 'withMedia'],
|
props: ['user', 'withMedia'],
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
fetching: true,
|
fetching: true,
|
||||||
posts: []
|
posts: [],
|
||||||
|
existMore: false,
|
||||||
|
moreFetching: false
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
(this as any).api('users/posts', {
|
(this as any).api('users/posts', {
|
||||||
user_id: this.user.id,
|
user_id: this.user.id,
|
||||||
with_media: this.withMedia
|
with_media: this.withMedia,
|
||||||
|
limit: limit + 1
|
||||||
}).then(posts => {
|
}).then(posts => {
|
||||||
|
if (posts.length == limit + 1) {
|
||||||
|
posts.pop();
|
||||||
|
this.existMore = true;
|
||||||
|
}
|
||||||
this.posts = posts;
|
this.posts = posts;
|
||||||
this.fetching = false;
|
this.fetching = false;
|
||||||
this.$emit('loaded');
|
this.$emit('loaded');
|
||||||
});
|
});
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
more() {
|
||||||
|
this.moreFetching = true;
|
||||||
|
(this as any).api('users/posts', {
|
||||||
|
user_id: this.user.id,
|
||||||
|
with_media: this.withMedia,
|
||||||
|
limit: limit + 1,
|
||||||
|
until_id: this.posts[this.posts.length - 1].id
|
||||||
|
}).then(posts => {
|
||||||
|
if (posts.length == limit + 1) {
|
||||||
|
posts.pop();
|
||||||
|
this.existMore = true;
|
||||||
|
} else {
|
||||||
|
this.existMore = false;
|
||||||
|
}
|
||||||
|
this.posts = this.posts.concat(posts);
|
||||||
|
this.moreFetching = false;
|
||||||
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -66,15 +66,11 @@ export default Vue.extend({
|
||||||
components: {
|
components: {
|
||||||
XHome
|
XHome
|
||||||
},
|
},
|
||||||
props: {
|
|
||||||
page: {
|
|
||||||
default: 'home'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
fetching: true,
|
fetching: true,
|
||||||
user: null
|
user: null,
|
||||||
|
page: 'home'
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
|
Loading…
Reference in a new issue