2017-09-10 17:25:29 +05:30
|
|
|
<script>
|
2018-12-05 23:21:45 +05:30
|
|
|
import PaginationLinks from '~/vue_shared/components/pagination_links.vue';
|
2022-06-21 17:19:12 +05:30
|
|
|
import { getParameterByName } from '~/lib/utils/url_utility';
|
2022-11-25 23:54:43 +05:30
|
|
|
import { __ } from '~/locale';
|
2021-03-11 19:13:27 +05:30
|
|
|
import eventHub from '../event_hub';
|
2017-09-10 17:25:29 +05:30
|
|
|
|
2018-11-20 20:47:30 +05:30
|
|
|
export default {
|
2022-11-25 23:54:43 +05:30
|
|
|
i18n: {
|
|
|
|
emptyStateTitle: __('No results found'),
|
|
|
|
emptyStateDescription: __('Edit your search and try again'),
|
|
|
|
},
|
2018-11-20 20:47:30 +05:30
|
|
|
components: {
|
2018-12-05 23:21:45 +05:30
|
|
|
PaginationLinks,
|
2018-11-20 20:47:30 +05:30
|
|
|
},
|
|
|
|
props: {
|
|
|
|
groups: {
|
|
|
|
type: Array,
|
|
|
|
required: true,
|
2017-09-10 17:25:29 +05:30
|
|
|
},
|
2018-11-20 20:47:30 +05:30
|
|
|
pageInfo: {
|
|
|
|
type: Object,
|
|
|
|
required: true,
|
2017-09-10 17:25:29 +05:30
|
|
|
},
|
2018-11-20 20:47:30 +05:30
|
|
|
action: {
|
|
|
|
type: String,
|
|
|
|
required: false,
|
|
|
|
default: '',
|
|
|
|
},
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
change(page) {
|
2021-11-11 11:23:49 +05:30
|
|
|
const filterGroupsBy = getParameterByName('filter');
|
|
|
|
const sortBy = getParameterByName('sort');
|
|
|
|
const archived = getParameterByName('archived');
|
|
|
|
eventHub.$emit(`${this.action}fetchPage`, { page, filterGroupsBy, sortBy, archived });
|
2018-11-20 20:47:30 +05:30
|
|
|
},
|
|
|
|
},
|
|
|
|
};
|
2017-09-10 17:25:29 +05:30
|
|
|
</script>
|
|
|
|
|
|
|
|
<template>
|
2022-08-27 11:52:29 +05:30
|
|
|
<div class="groups-list-tree-container" data-qa-selector="groups_list_tree_container">
|
2023-03-04 22:38:38 +05:30
|
|
|
<group-folder :groups="groups" :action="action" />
|
|
|
|
<pagination-links
|
|
|
|
:change="change"
|
|
|
|
:page-info="pageInfo"
|
|
|
|
class="d-flex justify-content-center gl-mt-3"
|
2022-11-25 23:54:43 +05:30
|
|
|
/>
|
2017-09-10 17:25:29 +05:30
|
|
|
</div>
|
|
|
|
</template>
|