amechama/sharkey
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wip: refactor(client): migrate paging components to composition api

Browse Source
This commit is contained in:
syuilo 2022-01-10 03:30:35 +09:00
parent 186a9e3b41
commit 06125e6820
15 changed files with 51 additions and 122 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
packages/client/src/pages/admin/abuses.vue
View File

@ -62,7 +62,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { computed, defineComponent } from 'vue';
import MkButton from '@/components/ui/button.vue';
import MkInput from '@/components/form/input.vue';
@ -97,29 +97,15 @@ export default defineComponent({
pagination: {
endpoint: 'admin/abuse-user-reports',
limit: 10,
params: () => ({
params: computed(() => ({
state: this.state,
reporterOrigin: this.reporterOrigin,
targetUserOrigin: this.targetUserOrigin,
}),
})),
},
}
},
watch: {
state() {
this.$refs.reports.reload();
},
reporterOrigin() {
this.$refs.reports.reload();
},
targetUserOrigin() {
this.$refs.reports.reload();
},
},
mounted() {
this.$emit('info', this[symbols.PAGE_INFO]);
},

20
packages/client/src/pages/admin/files.vue
View File

@ -55,7 +55,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { computed, defineComponent } from 'vue';
import MkButton from '@/components/ui/button.vue';
import MkInput from '@/components/form/input.vue';
import MkSelect from '@/components/form/select.vue';
@ -97,27 +97,15 @@ export default defineComponent({
pagination: {
endpoint: 'admin/drive/files',
limit: 10,
params: () => ({
params: computed(() => ({
type: (this.type && this.type !== '') ? this.type : null,
origin: this.origin,
hostname: (this.hostname && this.hostname !== '') ? this.hostname : null,
}),
hostname: (this.searchHost && this.searchHost !== '') ? this.searchHost : null,
})),
},
}
},
watch: {
type() {
this.$refs.files.reload();
},
origin() {
this.$refs.files.reload();
},
searchHost() {
this.$refs.files.reload();
},
},
mounted() {
this.$emit('info', this[symbols.PAGE_INFO]);
},

18
packages/client/src/pages/admin/users.vue
View File

@ -62,7 +62,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { computed, defineComponent } from 'vue';
import MkButton from '@/components/ui/button.vue';
import MkInput from '@/components/form/input.vue';
import MkSelect from '@/components/form/select.vue';
@ -112,30 +112,18 @@ export default defineComponent({
pagination: {
endpoint: 'admin/show-users',
limit: 10,
params: () => ({
params: computed(() => ({
sort: this.sort,
state: this.state,
origin: this.origin,
username: this.searchUsername,
hostname: this.searchHost,
}),
})),
offsetMode: true
},
}
},
watch: {
sort() {
this.$refs.users.reload();
},
state() {
this.$refs.users.reload();
},
origin() {
this.$refs.users.reload();
},
},
async mounted() {
this.$emit('info', this[symbols.PAGE_INFO]);
},

4
packages/client/src/pages/channel.vue
View File

@ -69,9 +69,9 @@ export default defineComponent({
pagination: {
endpoint: 'channels/timeline',
limit: 10,
params: () => ({
params: computed(() => ({
channelId: this.channelId,
})
}))
},
};
},

4
packages/client/src/pages/clip.vue
View File

@ -52,9 +52,9 @@ export default defineComponent({
pagination: {
endpoint: 'clips/notes',
limit: 10,
params: () => ({
params: computed(() => ({
clipId: this.clipId,
})
}))
},
};
},

6
packages/client/src/pages/federation.vue
View File

@ -96,7 +96,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { computed, defineComponent } from 'vue';
import MkButton from '@/components/ui/button.vue';
import MkInput from '@/components/form/input.vue';
import MkSelect from '@/components/form/select.vue';
@ -130,7 +130,7 @@ export default defineComponent({
endpoint: 'federation/instances',
limit: 10,
offsetMode: true,
params: () => ({
params: computed(() => ({
sort: this.sort,
host: this.host != '' ? this.host : null,
...(
@ -141,7 +141,7 @@ export default defineComponent({
this.state === 'blocked' ? { blocked: true } :
this.state === 'notResponding' ? { notResponding: true } :
{})
})
}))
},
}
},

4
packages/client/src/pages/gallery/post.vue
View File

@ -95,9 +95,9 @@ export default defineComponent({
otherPostsPagination: {
endpoint: 'users/gallery/posts',
limit: 6,
params: () => ({
params: computed(() => ({
userId: this.post.user.id
})
})),
},
post: null,
error: null,

4
packages/client/src/pages/page.vue
View File

@ -108,9 +108,9 @@ export default defineComponent({
otherPostsPagination: {
endpoint: 'users/pages',
limit: 6,
params: () => ({
params: computed(() => ({
userId: this.page.user.id
})
})),
},
};
},

10
packages/client/src/pages/search.vue
View File

@ -25,18 +25,12 @@ export default defineComponent({
pagination: {
endpoint: 'notes/search',
limit: 10,
params: () => ({
params: computed(() => ({
query: this.$route.query.q,
channelId: this.$route.query.channel,
})
}))
},
};
},
watch: {
$route() {
(this.$refs.notes as any).reload();
}
},
});
</script>

12
packages/client/src/pages/tag.vue
View File

@ -5,7 +5,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { computed, defineComponent } from 'vue';
import XNotes from '@/components/notes.vue';
import * as symbols from '@/symbols';
@ -30,17 +30,11 @@ export default defineComponent({
pagination: {
endpoint: 'notes/search-by-tag',
limit: 10,
params: () => ({
params: computed(() => ({
tag: this.tag,
})
}))
},
};
},
watch: {
tag() {
(this.$refs.notes as any).reload();
}
},
});
</script>

29
packages/client/src/pages/user/follow-list.vue
View File

@ -1,6 +1,6 @@
<template>
<div>
<MkPagination v-slot="{items}" ref="list" :pagination="pagination" class="mk-following-or-followers">
<MkPagination v-slot="{items}" ref="list" :pagination="type === 'following' ? followingPagination : followersPagination" class="mk-following-or-followers">
<div class="users _isolated">
<MkUserInfo v-for="user in items.map(x => type === 'following' ? x.followee : x.follower)" :key="user.id" class="user" :user="user"/>
</div>
@ -9,7 +9,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { computed, defineComponent } from 'vue';
import MkUserInfo from '@/components/user-info.vue';
import MkPagination from '@/components/ui/pagination.vue';
@ -32,25 +32,22 @@ export default defineComponent({
data() {
return {
pagination: {
endpoint: () => this.type === 'following' ? 'users/following' : 'users/followers',
followingPagination: {
endpoint: 'users/following',
limit: 20,
params: {
params: computed(() => ({
userId: this.user.id,
}
})),
},
followersPagination: {
endpoint: 'users/followers',
limit: 20,
params: computed(() => ({
userId: this.user.id,
})),
},
};
},
watch: {
type() {
this.$refs.list.reload();
},
user() {
this.$refs.list.reload();
}
}
});
</script>

12
packages/client/src/pages/user/gallery.vue
View File

@ -9,7 +9,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { computed, defineComponent } from 'vue';
import MkGalleryPostPreview from '@/components/gallery-post-preview.vue';
import MkPagination from '@/components/ui/pagination.vue';
@ -31,18 +31,12 @@ export default defineComponent({
pagination: {
endpoint: 'users/gallery/posts',
limit: 6,
params: () => ({
params: computed(() => ({
userId: this.user.id
})
})),
},
};
},
watch: {
user() {
this.$refs.list.reload();
}
}
});
</script>

12
packages/client/src/pages/user/pages.vue
View File

@ -7,7 +7,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { computed, defineComponent } from 'vue';
import MkPagePreview from '@/components/page-preview.vue';
import MkPagination from '@/components/ui/pagination.vue';
@ -29,18 +29,12 @@ export default defineComponent({
pagination: {
endpoint: 'users/pages',
limit: 20,
params: {
params: computed(() => ({
userId: this.user.id,
}
})),
},
};
},
watch: {
user() {
this.$refs.list.reload();
}
}
});
</script>

12
packages/client/src/pages/user/reactions.vue
View File

@ -14,7 +14,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { computed, defineComponent } from 'vue';
import MkPagination from '@/components/ui/pagination.vue';
import MkNote from '@/components/note.vue';
import MkReactionIcon from '@/components/reaction-icon.vue';
@ -38,18 +38,12 @@ export default defineComponent({
pagination: {
endpoint: 'users/reactions',
limit: 20,
params: {
params: computed(() => ({
userId: this.user.id,
}
})),
},
};
},
watch: {
user() {
this.$refs.list.reload();
}
},
});
</script>

6
packages/client/src/ui/deck/direct-column.vue
View File

@ -7,7 +7,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { computed, defineComponent } from 'vue';
import XColumn from './column.vue';
import XNotes from '@/components/notes.vue';
import * as os from '@/os';
@ -34,9 +34,9 @@ export default defineComponent({
pagination: {
endpoint: 'notes/mentions',
limit: 10,
params: () => ({
params: computed(() => ({
visibility: 'specified'
})
})),
},
}
},