summaryrefslogtreecommitdiff
path: root/packages/frontend/src/components/MkPaginationControl.vue
diff options
context:
space:
mode:
authorかっこかり <67428053+kakkokari-gtyih@users.noreply.github.com>2025-09-13 21:00:33 +0900
committerGitHub <noreply@github.com>2025-09-13 21:00:33 +0900
commitd4654dd7bd5bf1c7faa74ed89f592448c0076be8 (patch)
treeb4f51e86f174717fef469fbedca48faa2a55e841 /packages/frontend/src/components/MkPaginationControl.vue
parentfix(deps): update dependency vite [security] (#16535) (diff)
downloadmisskey-d4654dd7bd5bf1c7faa74ed89f592448c0076be8.tar.gz
misskey-d4654dd7bd5bf1c7faa74ed89f592448c0076be8.tar.bz2
misskey-d4654dd7bd5bf1c7faa74ed89f592448c0076be8.zip
refactor(frontend): os.select, MkSelectのitem指定をオブジェクトによる定義に統一し、型を狭める (#16475)
* refactor(frontend): MkSelectのitem指定をオブジェクトによる定義に統一 * fix * spdx * fix * fix os.select * fix lint * add comment * fix * fix: os.select対応漏れを修正 * fix * fix * fix: MkSelectのmodelに対する型チェックを厳格化 * fix * fix * fix * Update packages/frontend/src/components/MkEmbedCodeGenDialog.vue Co-authored-by: syuilo <4439005+syuilo@users.noreply.github.com> * fix * fix types * fix * fix * Update packages/frontend/src/pages/admin/roles.editor.vue Co-authored-by: syuilo <4439005+syuilo@users.noreply.github.com> * fix: MkSelectに直接配列を指定している場合に正常に型が解決されるように --------- Co-authored-by: syuilo <4439005+syuilo@users.noreply.github.com>
Diffstat (limited to 'packages/frontend/src/components/MkPaginationControl.vue')
-rw-r--r--packages/frontend/src/components/MkPaginationControl.vue14
1 files changed, 12 insertions, 2 deletions
diff --git a/packages/frontend/src/components/MkPaginationControl.vue b/packages/frontend/src/components/MkPaginationControl.vue
index 10bed575a4..55aa3f2dc2 100644
--- a/packages/frontend/src/components/MkPaginationControl.vue
+++ b/packages/frontend/src/components/MkPaginationControl.vue
@@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<template>
<div :class="$style.root">
<div :class="$style.control">
- <MkSelect v-model="order" :class="$style.order" :items="[{ label: i18n.ts._order.newest, value: 'newest' }, { label: i18n.ts._order.oldest, value: 'oldest' }]">
+ <MkSelect v-model="order" :class="$style.order" :items="orderDef">
<template #prefix><i class="ti ti-arrows-sort"></i></template>
</MkSelect>
<MkButton v-if="paginator.canSearch" v-tooltip="i18n.ts.search" iconOnly transparent rounded :active="searchOpened" @click="searchOpened = !searchOpened"><i class="ti ti-search"></i></MkButton>
@@ -45,6 +45,7 @@ import { i18n } from '@/i18n.js';
import MkSelect from '@/components/MkSelect.vue';
import MkInput from '@/components/MkInput.vue';
import { formatDateTimeString } from '@/utility/format-time-string.js';
+import { useMkSelect } from '@/composables/use-mkselect.js';
const props = withDefaults(defineProps<{
paginator: T;
@@ -58,7 +59,16 @@ const props = withDefaults(defineProps<{
const searchOpened = ref(false);
const filterOpened = ref(props.filterOpened);
-const order = ref<'newest' | 'oldest'>('newest');
+const {
+ model: order,
+ def: orderDef,
+} = useMkSelect({
+ items: [
+ { label: i18n.ts._order.newest, value: 'newest' },
+ { label: i18n.ts._order.oldest, value: 'oldest' },
+ ],
+ initialValue: 'newest',
+});
const date = ref<number | null>(null);
const q = ref<string | null>(null);