Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 | 2x 12x | <script>
import { GlKeysetPagination } from '@gitlab/ui';
// eslint-disable-next-line no-restricted-imports
import { mapState, mapActions } from 'vuex';
import { PREV, NEXT } from '../constants';
import GeoReplicableItem from './geo_replicable_item.vue';
export default {
name: 'GeoReplicable',
components: {
GlKeysetPagination,
GeoReplicableItem,
},
computed: {
...mapState(['replicableItems', 'paginationData']),
},
methods: {
...mapActions(['fetchReplicableItems']),
buildName(item) {
return item.name ? item.name : item.id;
},
},
NEXT,
PREV,
};
</script>
<template>
<section>
<geo-replicable-item
v-for="item in replicableItems"
:key="item.id"
:name="buildName(item)"
:registry-id="item.id"
:sync-status="item.state.toLowerCase()"
:last-synced="item.lastSyncedAt"
:last-verified="item.verifiedAt"
/>
<div class="gl-display-flex gl-justify-content-center gl-mt-6">
<gl-keyset-pagination
v-bind="paginationData"
@next="fetchReplicableItems($options.NEXT)"
@prev="fetchReplicableItems($options.PREV)"
/>
</div>
</section>
</template>
|