dennii/dbgate
1
0
Fork 0
mirror of https://github.com/DeNNiiInc/dbgate.git synced 2026-04-19 06:06:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: make summary table sortable, filtrable, with sticky header

Browse Source
This commit is contained in:
Pavel
2025-08-19 17:08:38 +02:00
parent 78215552bf
commit 114ce1ea3a
7 changed files with 140 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
packages/web/src/widgets/SummaryProcesses.svelte
View File

@@ -1,4 +1,5 @@
<script lang="ts">
import { writable } from 'svelte/store';
import { DatabaseProcess } from 'dbgate-types';
import TableControl from '../elements/TableControl.svelte';
import { _t } from '../translations';
@@ -15,6 +16,8 @@
export let refreshInterval: number = 1000;
export let tabVisible: boolean = false;
const filters = writable({});
let internalProcesses = [...processes];
async function refreshProcesses() {
@@ -79,20 +82,54 @@
<div>
<TableControl
{filters}
stickyHeader
rows={internalProcesses}
columns={[
{ header: _t('summaryProcesses.processId', { defaultMessage: 'Process ID' }), fieldName: 'processId', slot: 1 },
{ header: _t('summaryProcesses.connectionId', { defaultMessage: 'Connection ID' }), fieldName: 'connectionId' },
{ header: _t('summaryProcesses.client', { defaultMessage: 'Client' }), fieldName: 'client' },
{ header: _t('summaryProcesses.operation', { defaultMessage: 'Operation' }), fieldName: 'operation' },
{ header: _t('summaryProcesses.namespace', { defaultMessage: 'Namespace' }), fieldName: 'namespace' },
{
sortable: true,
filterable: true,
header: _t('summaryProcesses.processId', { defaultMessage: 'Process ID' }),
fieldName: 'processId',
slot: 1,
},
{
sortable: true,
filterable: true,
header: _t('summaryProcesses.connectionId', { defaultMessage: 'Connection ID' }),
fieldName: 'connectionId',
},
{
sortable: true,
filterable: true,
header: _t('summaryProcesses.client', { defaultMessage: 'Client' }),
fieldName: 'client',
},
{
filterable: true,
header: _t('summaryProcesses.operation', { defaultMessage: 'Operation' }),
fieldName: 'operation',
},
{
sortable: true,
filterable: true,
header: _t('summaryProcesses.namespace', { defaultMessage: 'Namespace' }),
fieldName: 'namespace',
},
{
sortable: true,
header: _t('summaryProcesses.runningTime', { defaultMessage: 'Running Time' }),
fieldName: 'runningTime',
slot: 2,
},
{ header: _t('summaryProcesses.state', { defaultMessage: 'State' }), fieldName: 'state' },
{
sortable: true,
filterable: true,
header: _t('summaryProcesses.state', { defaultMessage: 'State' }),
fieldName: 'state',
},
{
sortable: true,
header: _t('summaryProcesses.waitingFor', { defaultMessage: 'Waiting For' }),
fieldName: 'waitingFor',
slot: 3,