wip: refactor(client): migrate paging components to composition api
This commit is contained in:
parent
861d028d09
commit
7271fbb092
2 changed files with 25 additions and 59 deletions
|
@ -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,
|
limit: 10,
|
||||||
required: true
|
params: computed(() => ({
|
||||||
},
|
visibility: 'specified' as const,
|
||||||
isStacked: {
|
})),
|
||||||
type: Boolean,
|
};
|
||||||
required: true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
pagination: {
|
|
||||||
endpoint: 'notes/mentions' as const,
|
|
||||||
limit: 10,
|
|
||||||
params: computed(() => ({
|
|
||||||
visibility: 'specified'
|
|
||||||
})),
|
|
||||||
},
|
|
||||||
}
|
|
||||||
},
|
|
||||||
});
|
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -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: {
|
endpoint: 'notes/mentions' as const,
|
||||||
type: Object,
|
limit: 10,
|
||||||
required: true
|
};
|
||||||
},
|
|
||||||
isStacked: {
|
|
||||||
type: Boolean,
|
|
||||||
required: true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
pagination: {
|
|
||||||
endpoint: 'notes/mentions' as const,
|
|
||||||
limit: 10,
|
|
||||||
},
|
|
||||||
}
|
|
||||||
},
|
|
||||||
});
|
|
||||||
</script>
|
</script>
|
||||||
|
|
Loading…
Reference in a new issue