mirror of
https://github.com/Abdulazizzn/n8n-enterprise-unlocked.git
synced 2025-12-19 19:11:13 +00:00
feat(editor): Add pagination to the workflows list (#13100)
This commit is contained in:
committed by
GitHub
parent
67a4ed18a1
commit
8e37088249
@@ -15,8 +15,8 @@ import VariablesForm from '@/components/VariablesForm.vue';
|
||||
import VariablesUsageBadge from '@/components/VariablesUsageBadge.vue';
|
||||
|
||||
import ResourcesListLayout, {
|
||||
type IResource,
|
||||
type IFilters,
|
||||
type Resource,
|
||||
type BaseFilters,
|
||||
} from '@/components/layouts/ResourcesListLayout.vue';
|
||||
|
||||
import { EnterpriseEditionFeature, MODAL_CONFIRM } from '@/constants';
|
||||
@@ -154,26 +154,30 @@ const handleDeleteVariable = async (variable: EnvironmentVariable) => {
|
||||
}
|
||||
};
|
||||
|
||||
type Filters = IFilters & { incomplete?: boolean };
|
||||
type Filters = BaseFilters & { incomplete?: boolean };
|
||||
const updateFilter = (state: Filters) => {
|
||||
void router.replace({ query: pickBy(state) as LocationQueryRaw });
|
||||
};
|
||||
const filters = computed<Filters>(
|
||||
() => ({ ...route.query, incomplete: route.query.incomplete?.toString() === 'true' }) as Filters,
|
||||
);
|
||||
const onSearchUpdated = (search: string) => {
|
||||
updateFilter({ ...filters.value, search });
|
||||
};
|
||||
const filters = ref<Filters>({
|
||||
...route.query,
|
||||
incomplete: route.query.incomplete?.toString() === 'true',
|
||||
} as Filters);
|
||||
|
||||
const handleFilter = (resource: IResource, newFilters: IFilters, matches: boolean): boolean => {
|
||||
const iResource = resource as EnvironmentVariable;
|
||||
const handleFilter = (resource: Resource, newFilters: BaseFilters, matches: boolean): boolean => {
|
||||
const Resource = resource as EnvironmentVariable;
|
||||
const filtersToApply = newFilters as Filters;
|
||||
|
||||
if (filtersToApply.incomplete) {
|
||||
matches = matches && !iResource.value;
|
||||
matches = matches && !Resource.value;
|
||||
}
|
||||
|
||||
return matches;
|
||||
};
|
||||
|
||||
const nameSortFn = (a: IResource, b: IResource, direction: 'asc' | 'desc') => {
|
||||
const nameSortFn = (a: Resource, b: Resource, direction: 'asc' | 'desc') => {
|
||||
if (`${a.id}`.startsWith(TEMPORARY_VARIABLE_UID_BASE)) {
|
||||
return -1;
|
||||
} else if (`${b.id}`.startsWith(TEMPORARY_VARIABLE_UID_BASE)) {
|
||||
@@ -185,8 +189,8 @@ const nameSortFn = (a: IResource, b: IResource, direction: 'asc' | 'desc') => {
|
||||
: displayName(b).trim().localeCompare(displayName(a).trim());
|
||||
};
|
||||
const sortFns = {
|
||||
nameAsc: (a: IResource, b: IResource) => nameSortFn(a, b, 'asc'),
|
||||
nameDesc: (a: IResource, b: IResource) => nameSortFn(a, b, 'desc'),
|
||||
nameAsc: (a: Resource, b: Resource) => nameSortFn(a, b, 'asc'),
|
||||
nameDesc: (a: Resource, b: Resource) => nameSortFn(a, b, 'desc'),
|
||||
};
|
||||
|
||||
const unavailableNoticeProps = computed(() => ({
|
||||
@@ -203,7 +207,7 @@ function goToUpgrade() {
|
||||
void usePageRedirectionHelper().goToUpgrade('variables', 'upgrade-variables');
|
||||
}
|
||||
|
||||
function displayName(resource: IResource) {
|
||||
function displayName(resource: Resource) {
|
||||
return (resource as EnvironmentVariable).key;
|
||||
}
|
||||
|
||||
@@ -223,10 +227,10 @@ onMounted(() => {
|
||||
<template>
|
||||
<ResourcesListLayout
|
||||
ref="layoutRef"
|
||||
v-model:filters="filters"
|
||||
resource-key="variables"
|
||||
:disabled="!isFeatureEnabled"
|
||||
:resources="variables"
|
||||
:filters="filters"
|
||||
:additional-filters-handler="handleFilter"
|
||||
:shareable="false"
|
||||
:display-name="displayName"
|
||||
@@ -236,6 +240,7 @@ onMounted(() => {
|
||||
:type-props="{ columns }"
|
||||
:loading="isLoading"
|
||||
@update:filters="updateFilter"
|
||||
@update:search="onSearchUpdated"
|
||||
@click:add="addEmptyVariableForm"
|
||||
>
|
||||
<template #header>
|
||||
|
||||
Reference in New Issue
Block a user