ops/front
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat

Browse Source
This commit is contained in:
daxiong
2026-04-18 14:23:06 +08:00
parent d5df671ff6
commit 878cbea9a5
1 changed files with 702 additions and 734 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
src/views/ops/pages/monitor/host-hardware/index.vue
View File

@@ -25,9 +25,7 @@
</a-option>
</a-select>
</div>
<div v-if="activeServer" class="toolbar-meta text-muted">
{{ activeServer.os }} · {{ activeServer.location }}
</div>
<div v-if="activeServer" class="toolbar-meta text-muted">{{ activeServer.os }} · {{ activeServer.location }}</div>
</div>
<a-spin :loading="loading" style="width: 100%">
@@ -44,12 +42,7 @@
</div>
<template v-else>
<a-alert
v-if="statusSnapshot?.error_message"
type="warning"
:title="statusSnapshot.error_message"
style="margin-bottom: 16px"
/>
<a-alert v-if="statusSnapshot?.error_message" type="warning" :title="statusSnapshot.error_message" style="margin-bottom: 16px" />
<a-card title="带外设备与采集摘要" :bordered="false" class="hw-card">
<a-descriptions :column="{ xs: 1, sm: 2, md: 3 }" size="small" layout="horizontal">
@@ -126,21 +119,8 @@
</a-card>
<template v-if="groupedMetrics.length">
<a-card
v-for="g in groupedMetrics"
:key="g.type"
:title="g.title"
:bordered="false"
class="hw-card"
>
<a-table
:columns="metricColumns"
:data="g.rows"
:pagination="false"
row-key="__key"
size="small"
:bordered="{ cell: true }"
>
<a-card v-for="g in groupedMetrics" :key="g.type" :title="g.title" :bordered="false" class="hw-card">
<a-table :columns="metricColumns" :data="g.rows" :pagination="false" row-key="__key" size="small" :bordered="{ cell: true }">
<template #status="{ record }">
<a-tag size="small" :color="healthColor(record.status)">
{{ record.status || '—' }}
@@ -164,9 +144,9 @@
/>
<span class="text-muted">默认最近 24 小时</span>
</div>
<a-spin :loading="historyLoading">
<a-spin :loading="historyLoading" style="width: 100%;">
<div class="hw-chart-wrap">
<Chart v-if="historyChartOptions" :options="historyChartOptions" height="280px" />
<Chart v-if="historyChartOptions" :options="historyChartOptions" height="280px"/>
<a-empty v-else description="暂无曲线数据" />
</div>
</a-spin>
@@ -231,9 +211,7 @@ const historyChartOptions = ref<Record<string, unknown> | null>(null)
const serverOptions = ref<ServerOption[]>([])
const selectedServerIdentity = ref<string | undefined>(undefined)
const activeServer = computed(() =>
serverOptions.value.find((s) => s.server_identity === selectedServerIdentity.value),
)
const activeServer = computed(() => serverOptions.value.find((s) => s.server_identity === selectedServerIdentity.value))
/** 与 hardware_devices.type 一致：server/switch/storage 等 */
function deviceTypeLabel(t?: string) {
@@ -253,7 +231,7 @@ const deviceId = computed(() => collection.value?.device_id ?? '')
const timescaledb = computed(() => collection.value?.timescaledb === true)
const normalizedMetrics = computed<NormalizedHostHardwareMetric[]>(() =>
normalizeHostHardwareMetrics(statusSnapshot.value, collection.value?.metrics),
normalizeHostHardwareMetrics(statusSnapshot.value, collection.value?.metrics)
)
const metricNameOptions = computed(() => {
@@ -297,17 +275,7 @@ const subStatusItems = computed(() => {
}))
})
const GROUP_ORDER = [
'temperature',
'fan_speed',
'voltage',
'current',
'power',
'power_status',
'network',
'system',
'uptime',
]
const GROUP_ORDER = ['temperature', 'fan_speed', 'voltage', 'current', 'power', 'power_status', 'network', 'system', 'uptime']
function groupTitle(t: string): string {
const map: Record<string, string> = {
@@ -523,7 +491,9 @@ async function loadHostHardware() {
}
const names = [
...new Set(
normalizeHostHardwareMetrics(data.status, data.metrics).map((m) => m.name).filter(Boolean),
normalizeHostHardwareMetrics(data.status, data.metrics)
.map((m) => m.name)
.filter(Boolean)
),
]
selectedMetricName.value = names.sort()[0] || ''
@@ -564,10 +534,7 @@ async function loadServerOptions() {
os: [r.os, r.os_version].filter(Boolean).join(' ') || '-',
location: r.location || '-',
}))
if (
selectedServerIdentity.value &&
!serverOptions.value.some((s) => s.server_identity === selectedServerIdentity.value)
) {
if (selectedServerIdentity.value && !serverOptions.value.some((s) => s.server_identity === selectedServerIdentity.value)) {
selectedServerIdentity.value = undefined
}
if (!selectedServerIdentity.value && serverOptions.value.length > 0) {
@@ -586,7 +553,7 @@ watch(
() => {
loadHostHardware()
},
{ immediate: true },
{ immediate: true }
)
watch([selectedMetricName, timescaledb, deviceId], () => {
@@ -714,6 +681,7 @@ export default {
}
.hw-chart-wrap {
width: 100%;
min-height: 280px;
}