UniqAI/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui synced 2025-01-18 00:30:51 +00:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

Merge pull request #3140 from ricky-davis/sortable-users

Browse Source 
feat: Sortable users in admin panel
This commit is contained in:
Timothy Jaeryang Baek 2024-06-16 21:49:08 -07:00 committed by GitHub
commit b4008b0b30
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 55 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
src/routes/(app)/admin/+page.svelte
View File

@ -77,6 +77,17 @@
}
loaded = true;
});
let sortKey = 'created_at'; // default sort key
let sortOrder = 'asc'; // default sort order
function setSortKey(key) {
if (sortKey === key) {
sortOrder = sortOrder === 'asc' ? 'desc' : 'asc';
} else {
sortKey = key;
sortOrder = 'asc';
}
}
</script>
<ConfirmDialog
@ -148,12 +159,46 @@
<table class="w-full text-sm text-left text-gray-500 dark:text-gray-400 table-auto max-w-full">
<thead class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-850 dark:text-gray-400">
<tr>
<th scope="col" class="px-3 py-2"> {$i18n.t('Role')} </th>
<th scope="col" class="px-3 py-2"> {$i18n.t('Name')} </th>
<th scope="col" class="px-3 py-2"> {$i18n.t('Email')} </th>
<th scope="col" class="px-3 py-2"> {$i18n.t('Last Active')} </th>
<th scope="col" class="px-3 py-2"> {$i18n.t('Created at')} </th>
<th scope="col" class="px-3 py-2 cursor-pointer select-none" on:click={() => setSortKey('role')}>
{$i18n.t('Role')}
{#if sortKey === 'role'}
{sortOrder === 'asc' ? '▲' : '▼'}
{:else}
<span class="invisible">▲</span>
{/if}
</th>
<th scope="col" class="px-3 py-2 cursor-pointer select-none" on:click={() => setSortKey('name')}>
{$i18n.t('Name')}
{#if sortKey === 'name'}
{sortOrder === 'asc' ? '▲' : '▼'}
{:else}
<span class="invisible">▲</span>
{/if}
</th>
<th scope="col" class="px-3 py-2 cursor-pointer select-none" on:click={() => setSortKey('email')}>
{$i18n.t('Email')}
{#if sortKey === 'email'}
{sortOrder === 'asc' ? '▲' : '▼'}
{:else}
<span class="invisible">▲</span>
{/if}
</th>
<th scope="col" class="px-3 py-2 cursor-pointer select-none" on:click={() => setSortKey('last_active_at')}>
{$i18n.t('Last Active')}
{#if sortKey === 'last_active_at'}
{sortOrder === 'asc' ? '▲' : '▼'}
{:else}
<span class="invisible">▲</span>
{/if}
</th>
<th scope="col" class="px-3 py-2 cursor-pointer select-none" on:click={() => setSortKey('created_at')}>
{$i18n.t('Created at')}
{#if sortKey === 'created_at'}
{sortOrder === 'asc' ? '▲' : '▼'}
{:else}
<span class="invisible">▲</span>
{/if}
</th>
<th scope="col" class="px-3 py-2 text-right" />
</tr>
@ -168,6 +213,10 @@
const query = search.toLowerCase();
return name.includes(query);
}
}).sort((a, b) => {
if (a[sortKey] < b[sortKey]) return sortOrder === 'asc' ? -1 : 1;
if (a[sortKey] > b[sortKey]) return sortOrder === 'asc' ? 1 : -1;
return 0;
})
.slice((page - 1) * 20, page * 20) as user}
<tr class="bg-white border-b dark:bg-gray-900 dark:border-gray-850 text-xs">