mirror/hotomoe
1
0
Fork 0
mirror of https://github.com/hotomoe/hotomoe synced 2024-11-29 07:18:13 +09:00
Code

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

Browse Source
This commit is contained in:
syuilo 2022-01-13 02:29:27 +09:00
parent 861d028d09
commit 7271fbb092
2 changed files with 25 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -2,43 +2,26 @@
<XColumn :column="column" :is-stacked="isStacked"> <XColumn :column="column" :is-stacked="isStacked">
<template #header><i class="fas fa-envelope" style="margin-right: 8px;"></i>{{ column.name }}</template> <template #header><i class="fas fa-envelope" style="margin-right: 8px;"></i>{{ column.name }}</template>
<XNotes :pagination="pagination" @before="before()" @after="after()"/> <XNotes :pagination="pagination"/>
</XColumn> </XColumn>
</template> </template>
<script lang="ts"> <script lang="ts" setup>
import { computed, defineComponent } from 'vue'; import { computed } from 'vue';
import XColumn from './column.vue'; import XColumn from './column.vue';
import XNotes from '@/components/notes.vue'; import XNotes from '@/components/notes.vue';
import * as os from '@/os'; import * as os from '@/os';
export default defineComponent({ const props = defineProps<{
components: { column: Record<string, unknown>; // TODO
XColumn, isStacked: boolean;
XNotes }>();
},
props: { const pagination = {
column: { point: 'notes/mentions' as const,
type: Object,
required: true
},
isStacked: {
type: Boolean,
required: true
}
},
data() {
return {
pagination: {
endpoint: 'notes/mentions' as const,
limit: 10, limit: 10,
params: computed(() => ({ params: computed(() => ({
visibility: 'specified' visibility: 'specified' as const,
})), })),
}, };
}
},
});
</script> </script>

35
packages/client/src/ui/deck/mentions-column.vue
View File

@ -2,40 +2,23 @@
<XColumn :column="column" :is-stacked="isStacked"> <XColumn :column="column" :is-stacked="isStacked">
<template #header><i class="fas fa-at" style="margin-right: 8px;"></i>{{ column.name }}</template> <template #header><i class="fas fa-at" style="margin-right: 8px;"></i>{{ column.name }}</template>
<XNotes :pagination="pagination" @before="before()" @after="after()"/> <XNotes :pagination="pagination"/>
</XColumn> </XColumn>
</template> </template>
<script lang="ts"> <script lang="ts" setup>
import { defineComponent } from 'vue'; import { } from 'vue';
import XColumn from './column.vue'; import XColumn from './column.vue';
import XNotes from '@/components/notes.vue'; import XNotes from '@/components/notes.vue';
import * as os from '@/os'; import * as os from '@/os';
export default defineComponent({ const props = defineProps<{
components: { column: Record<string, unknown>; // TODO
XColumn, isStacked: boolean;
XNotes }>();
},
props: { const pagination = {
column: {
type: Object,
required: true
},
isStacked: {
type: Boolean,
required: true
}
},
data() {
return {
pagination: {
endpoint: 'notes/mentions' as const, endpoint: 'notes/mentions' as const,
limit: 10, limit: 10,
}, };
}
},
});
</script> </script>