summaryrefslogtreecommitdiff
path: root/packages/client/src/pages/user/gallery.vue
diff options
context:
space:
mode:
Diffstat (limited to 'packages/client/src/pages/user/gallery.vue')
-rw-r--r--packages/client/src/pages/user/gallery.vue56
1 files changed, 56 insertions, 0 deletions
diff --git a/packages/client/src/pages/user/gallery.vue b/packages/client/src/pages/user/gallery.vue
new file mode 100644
index 0000000000..fb99cdff19
--- /dev/null
+++ b/packages/client/src/pages/user/gallery.vue
@@ -0,0 +1,56 @@
+<template>
+<div>
+ <MkPagination :pagination="pagination" #default="{items}">
+ <div class="jrnovfpt">
+ <MkGalleryPostPreview v-for="post in items" :post="post" :key="post.id" class="post"/>
+ </div>
+ </MkPagination>
+</div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import MkGalleryPostPreview from '@/components/gallery-post-preview.vue';
+import MkPagination from '@/components/ui/pagination.vue';
+
+export default defineComponent({
+ components: {
+ MkPagination,
+ MkGalleryPostPreview,
+ },
+
+ props: {
+ user: {
+ type: Object,
+ required: true
+ },
+ },
+
+ data() {
+ return {
+ pagination: {
+ endpoint: 'users/gallery/posts',
+ limit: 6,
+ params: () => ({
+ userId: this.user.id
+ })
+ },
+ };
+ },
+
+ watch: {
+ user() {
+ this.$refs.list.reload();
+ }
+ }
+});
+</script>
+
+<style lang="scss" scoped>
+.jrnovfpt {
+ display: grid;
+ grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
+ grid-gap: 12px;
+ margin: var(--margin);
+}
+</style>