rudeshark.net/src/client/app/mobile/views/pages/following.vue

71 lines
1.4 KiB
Vue
Raw Normal View History

2018-02-16 05:19:23 +01:00
<template>
<mk-ui>
2018-02-22 14:51:33 +01:00
<template slot="header" v-if="!fetching">
2018-03-29 07:48:47 +02:00
<img :src="`${user.avatarUrl}?thumbnail&size=64`" alt="">
2018-04-14 18:04:40 +02:00
{{ '%i18n:@following-of%'.replace('{}', name) }}
2018-02-22 14:51:33 +01:00
</template>
<mk-users-list
v-if="!fetching"
:fetch="fetchUsers"
2018-03-29 07:48:47 +02:00
:count="user.followingCount"
:you-know-count="user.followingYouKnowCount"
2018-02-22 14:51:33 +01:00
@loaded="onLoaded"
>
2018-04-14 18:04:40 +02:00
%i18n:@no-users%
2018-02-22 14:51:33 +01:00
</mk-users-list>
2018-02-16 05:19:23 +01:00
</mk-ui>
</template>
<script lang="ts">
import Vue from 'vue';
import Progress from '../../../common/scripts/loading';
2018-04-02 06:44:32 +02:00
import parseAcct from '../../../../../acct/parse';
2018-02-16 05:19:23 +01:00
export default Vue.extend({
data() {
return {
fetching: true,
user: null
};
},
2018-04-05 18:36:34 +02:00
computed: {
2018-04-09 11:52:29 +02:00
name(): string {
return Vue.filter('userName')(this.user);
2018-04-05 18:36:34 +02:00
}
},
2018-02-22 14:51:33 +01:00
watch: {
$route: 'fetch'
},
created() {
this.fetch();
},
2018-02-16 05:19:23 +01:00
mounted() {
2018-02-22 14:51:33 +01:00
document.documentElement.style.background = '#313a42';
2018-02-16 05:19:23 +01:00
},
methods: {
2018-02-22 14:51:33 +01:00
fetch() {
Progress.start();
this.fetching = true;
2018-03-27 09:51:12 +02:00
(this as any).api('users/show', parseAcct(this.$route.params.user)).then(user => {
2018-02-22 14:51:33 +01:00
this.user = user;
this.fetching = false;
2018-04-14 18:04:40 +02:00
document.title = '%i18n:@followers-of%'.replace('{}', this.name) + ' | Misskey';
2018-02-22 14:51:33 +01:00
});
},
2018-02-16 05:19:23 +01:00
onLoaded() {
Progress.done();
2018-02-22 14:51:33 +01:00
},
fetchUsers(iknow, limit, cursor, cb) {
(this as any).api('users/following', {
2018-03-29 07:48:47 +02:00
userId: this.user.id,
2018-02-22 14:51:33 +01:00
iknow: iknow,
limit: limit,
cursor: cursor ? cursor : undefined
}).then(cb);
2018-02-16 05:19:23 +01:00
}
}
});
</script>