wibu/monitoring-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: perbaiki layout filter Activity Logs agar tidak overflow

Browse Source
This commit is contained in:
amaliadwiy
2026-05-26 14:43:59 +08:00
parent 5002fd1519
commit 457f36be06
1 changed files with 35 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
src/frontend/routes/logs.tsx
View File

@@ -1,6 +1,7 @@
import { import {
ActionIcon, ActionIcon,
Badge, Badge,
Box,
Container, Container,
Group, Group,
Loader, Loader,
@@ -100,39 +101,43 @@ function GlobalLogsPage() {
</Group> </Group>
<Paper withBorder radius="xl" p="md" className="glass"> <Paper withBorder radius="xl" p="md" className="glass">
<Group gap="sm" wrap="wrap" align="flex-end"> <Stack gap="md">
<Select <Group gap="sm" wrap="wrap" align="flex-end">
label="User" <Select
placeholder="All users" label="User"
value={operatorId} placeholder="All users"
onChange={(v) => { setOperatorId(v ?? 'all'); setPage(1) }} value={operatorId}
data={operatorOptions} onChange={(v) => { setOperatorId(v ?? 'all'); setPage(1) }}
w={200} data={operatorOptions}
clearable style={{ flex: 1, minWidth: 160 }}
size="sm" clearable
/> size="sm"
<DatePickerInput />
type="range" <DatePickerInput
label="Date range" type="range"
placeholder="Pick a date range" label="Date range"
value={dateRange} placeholder="Pick a date range"
onChange={(v) => { setDateRange(v); setPage(1) }} value={dateRange}
locale="id" onChange={(v) => { setDateRange(v); setPage(1) }}
valueFormat="DD MMM YYYY" locale="id"
clearable valueFormat="DD MMM YYYY"
w={280} clearable
size="sm" style={{ flex: 2, minWidth: 220 }}
/> size="sm"
/>
</Group>
<Stack gap={4}> <Stack gap={4}>
<Text size="xs" fw={500} c="dimmed">Action type</Text> <Text size="xs" fw={500} c="dimmed">Action type</Text>
<SegmentedControl <Box style={{ overflowX: 'auto' }}>
value={type} <SegmentedControl
onChange={(v) => { setType(v); setPage(1) }} value={type}
size="sm" onChange={(v) => { setType(v); setPage(1) }}
data={LOG_TYPES.map((t) => ({ label: LOG_TYPE_LABEL[t] ?? t, value: t }))} size="sm"
/> data={LOG_TYPES.map((t) => ({ label: LOG_TYPE_LABEL[t] ?? t, value: t }))}
/>
</Box>
</Stack> </Stack>
</Group> </Stack>
</Paper> </Paper>
{isLoading && !data ? ( {isLoading && !data ? (