1
0
Fork 0
mirror of https://framagit.org/framasoft/mobilizon.git synced 2024-12-22 07:52:43 +00:00

Add pagination to resource mover modal as well

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2021-06-14 15:40:30 +02:00
parent 7c37b10ceb
commit 55a3d2b1d3
No known key found for this signature in database
GPG key ID: A061B9DDE0CA0773

View file

@ -58,18 +58,34 @@
>
{{ $t("No resources in this folder") }}
</p>
<b-pagination
v-if="resource.children.total > RESOURCES_PER_PAGE"
:total="resource.children.total"
v-model="page"
size="is-small"
:per-page="RESOURCES_PER_PAGE"
:aria-next-label="$t('Next page')"
:aria-previous-label="$t('Previous page')"
:aria-page-label="$t('Page')"
:aria-current-label="$t('Current page')"
/>
</article>
<div class="buttons">
<b-button type="is-text" @click="$emit('close-move-modal')">{{
$t("Cancel")
}}</b-button>
<b-button
type="is-primary"
@click="updateResource"
:disabled="moveDisabled"
>{{
$t("Move resource to {folder}", { folder: resource.title })
}}</b-button
><template v-if="resource.path === '/'">
{{ $t("Move resource to the root folder") }}
</template>
<template v-else
>{{ $t("Move resource to {folder}", { folder: resource.title }) }}
</template></b-button
>
<b-button type="is-text" @click="$emit('close-move-modal')">{{
$t("Cancel")
}}</b-button>
</div>
</div>
</template>
<script lang="ts">
@ -86,6 +102,8 @@ import { IResource } from "../../types/resource";
return {
path: this.resource.path,
username: this.username,
page: this.page,
limit: this.RESOURCES_PER_PAGE,
};
}
return { path: "/", username: this.username };
@ -103,6 +121,10 @@ export default class ResourceSelector extends Vue {
resource: IResource | undefined = this.initialResource.parent;
RESOURCES_PER_PAGE = 10;
page = 1;
goDown(element: IResource): void {
if (element.type === "folder" && element.id !== this.initialResource.id) {
this.resource = element;
@ -150,4 +172,11 @@ export default class ResourceSelector extends Vue {
color: #fff;
}
}
.buttons {
justify-content: flex-end;
}
nav.pagination {
margin: 0.5rem;
}
</style>