Public-Mirror/metacubexd
1
0
Fork 0
mirror of https://github.com/MetaCubeX/metacubexd.git synced 2024-09-20 14:02:46 +08:00
Code Issues Projects Releases Wiki Activity

feat(overview): update the overall look of the overview page

Browse Source
This commit is contained in:
kunish 2023-09-04 23:35:40 +08:00
parent 347ebb6f84
commit c757850c1a
No known key found for this signature in database
GPG Key ID: 647A12B4F782C430
3 changed files with 14 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/constants/index.ts
View File

@ -47,7 +47,7 @@ export enum ROUTES {
export const CHART_MAX_XAXIS = 10 export const CHART_MAX_XAXIS = 10
export const DEFAULT_CHART_OPTIONS: ApexOptions = { export const DEFAULT_CHART_OPTIONS: ApexOptions = {
title: { align: 'center', style: { color: 'gray' } }, title: { align: 'center', style: { color: 'gray', fontSize: '8px' } },
chart: { chart: {
toolbar: { show: false }, toolbar: { show: false },
zoom: { enabled: false }, zoom: { enabled: false },
@ -55,9 +55,10 @@ export const DEFAULT_CHART_OPTIONS: ApexOptions = {
}, },
noData: { text: 'Loading...' }, noData: { text: 'Loading...' },
legend: { legend: {
fontSize: '14px', showForSingleSeries: true,
fontSize: '8px',
labels: { colors: 'gray' }, labels: { colors: 'gray' },
itemMargin: { horizontal: 64 }, itemMargin: { horizontal: 32 },
}, },
dataLabels: { enabled: false }, dataLabels: { enabled: false },
grid: { yaxis: { lines: { show: false } } }, grid: { yaxis: { lines: { show: false } } },
@ -70,7 +71,7 @@ export const DEFAULT_CHART_OPTIONS: ApexOptions = {
}, },
yaxis: { yaxis: {
labels: { labels: {
style: { colors: 'gray' }, style: { colors: 'gray', fontSize: '8px' },
formatter: (val) => byteSize(val).toString(), formatter: (val) => byteSize(val).toString(),
}, },
}, },

8
src/pages/Config.tsx
View File

@ -188,13 +188,13 @@ const ConfigForm = () => {
{t('updateGEODatabases')} {t('updateGEODatabases')}
</Button> </Button>
<Button loading={restarting()} onClick={onRestart}>
{t('restartCore')}
</Button>
<Button loading={upgrading()} onClick={onUpgrade}> <Button loading={upgrading()} onClick={onUpgrade}>
{t('upgradeCore')} {t('upgradeCore')}
</Button> </Button>
<Button loading={restarting()} onClick={onRestart}>
{t('restartCore')}
</Button>
</div> </div>
</div> </div>
) )

8
src/pages/Overview.tsx
View File

@ -19,9 +19,9 @@ import { secret, wsEndpointURL } from '~/signals'
import type { Connection } from '~/types' import type { Connection } from '~/types'
const TrafficWidget: ParentComponent<{ label: JSX.Element }> = (props) => ( const TrafficWidget: ParentComponent<{ label: JSX.Element }> = (props) => (
<div class="stat flex-1"> <div class="stat flex-1 place-items-center">
<div class="stat-title text-primary-content">{props.label}</div> <div class="stat-title text-primary-content">{props.label}</div>
<div class="stat-value text-primary-content"> <div class="stat-value text-2xl text-primary-content lg:text-3xl">
{children(() => props.children)()} {children(() => props.children)()}
</div> </div>
</div> </div>
@ -102,7 +102,9 @@ export default () => {
merge({ title: { text: t('memory') } }, DEFAULT_CHART_OPTIONS), merge({ title: { text: t('memory') } }, DEFAULT_CHART_OPTIONS),
) )
const memoryChartSeries = createMemo(() => [{ data: memories() }]) const memoryChartSeries = createMemo(() => [
{ name: t('memory'), data: memories() },
])
const connectionsWS = createReconnectingWS( const connectionsWS = createReconnectingWS(
`${wsEndpointURL()}/connections?token=${secret()}`, `${wsEndpointURL()}/connections?token=${secret()}`,