mirror of
https://github.com/MetaCubeX/metacubexd.git
synced 2024-11-10 05:15:35 +08:00
feat(overview): update the overall look of the overview page
This commit is contained in:
parent
347ebb6f84
commit
c757850c1a
@ -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(),
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
@ -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>
|
||||||
)
|
)
|
||||||
|
@ -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()}`,
|
||||||
|
Loading…
Reference in New Issue
Block a user