mirror of
https://github.com/misskey-dev/misskey.git
synced 2026-05-21 16:55:33 +02:00
refactor(frontend): improve pagination implementation
This commit is contained in:
@@ -115,7 +115,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="tab === 'users'" class="_gaps_m">
|
||||
<MkPagination v-slot="{ items }" :pagination="usersPagination">
|
||||
<MkPagination v-slot="{ items }" :paginator="usersPaginator">
|
||||
<div :class="$style.users">
|
||||
<MkA v-for="user in items" :key="user.id" v-tooltip.mfm="`Last posted: ${user.updatedAt ? dateString(user.updatedAt) : 'unknown'}`" :to="`/admin/user/${user.id}`">
|
||||
<MkUserCardMini :user="user"/>
|
||||
@@ -132,10 +132,9 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, computed, watch } from 'vue';
|
||||
import { ref, computed, watch, markRaw } from 'vue';
|
||||
import * as Misskey from 'misskey-js';
|
||||
import type { ChartSrc } from '@/components/MkChart.vue';
|
||||
import type { PagingCtx } from '@/composables/use-pagination.js';
|
||||
import MkChart from '@/components/MkChart.vue';
|
||||
import MkObjectView from '@/components/MkObjectView.vue';
|
||||
import FormLink from '@/components/form/link.vue';
|
||||
@@ -156,6 +155,7 @@ import MkPagination from '@/components/MkPagination.vue';
|
||||
import { getProxiedImageUrlNullable } from '@/utility/media-proxy.js';
|
||||
import { dateString } from '@/filters/date.js';
|
||||
import MkTextarea from '@/components/MkTextarea.vue';
|
||||
import { Paginator } from '@/utility/paginator.js';
|
||||
|
||||
const props = defineProps<{
|
||||
host: string;
|
||||
@@ -173,8 +173,7 @@ const isMediaSilenced = ref(false);
|
||||
const faviconUrl = ref<string | null>(null);
|
||||
const moderationNote = ref('');
|
||||
|
||||
const usersPagination = {
|
||||
endpoint: iAmModerator ? 'admin/show-users' : 'users',
|
||||
const usersPaginator = iAmModerator ? markRaw(new Paginator('admin/show-users', {
|
||||
limit: 10,
|
||||
params: {
|
||||
sort: '+updatedAt',
|
||||
@@ -182,7 +181,15 @@ const usersPagination = {
|
||||
hostname: props.host,
|
||||
},
|
||||
offsetMode: true,
|
||||
} satisfies PagingCtx<'admin/show-users' | 'users'>;
|
||||
})) : markRaw(new Paginator('users', {
|
||||
limit: 10,
|
||||
params: {
|
||||
sort: '+updatedAt',
|
||||
state: 'all',
|
||||
hostname: props.host,
|
||||
},
|
||||
offsetMode: true,
|
||||
}));
|
||||
|
||||
if (iAmModerator) {
|
||||
watch(moderationNote, async () => {
|
||||
|
||||
Reference in New Issue
Block a user