1Panel-dev/1Panel
1
1
Fork 0
mirror of https://github.com/1Panel-dev/1Panel.git synced 2025-12-18 13:29:03 +08:00
Code Issues Projects Releases Packages Wiki Activity Actions

perf: Optimize GPU monitoring display (#11156)

Browse source
This commit is contained in:
ssongliu 2025-12-02 17:21:41 +08:00 • committed by GitHub
parent 63b62f4074
commit 656dda234c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
15 changed files with 314 additions and 521 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
agent/app/dto/monitor.go
View file

@ -48,25 +48,20 @@ type MonitorGPUSearch struct {
EndTime time.Time `json:"endTime"` EndTime time.Time `json:"endTime"`
} }
type MonitorGPUData struct { type MonitorGPUData struct {
Date []time.Time `json:"date"` Date []time.Time `json:"date"`
GPUValue []float64 `json:"gpuValue"` GPUValue []float64 `json:"gpuValue"`
TemperatureValue []float64 `json:"temperatureValue"` TemperatureValue []float64 `json:"temperatureValue"`
PowerValue []GPUPowerUsageHelper `json:"powerValue"` PowerTotal []float64 `json:"powerTotal"`
MemoryValue []GPUMemoryUsageHelper `json:"memoryValue"` PowerUsed []float64 `json:"powerUsed"`
SpeedValue []int `json:"speedValue"` PowerPercent []float64 `json:"powerPercent"`
} MemoryTotal []float64 `json:"memoryTotal"`
type GPUPowerUsageHelper struct { MemoryUsed []float64 `json:"memoryUsed"`
Total float64 `json:"total"` MemoryPercent []float64 `json:"memoryPercent"`
Used float64 `json:"used"` SpeedValue []int `json:"speedValue"`
Percent float64 `json:"percent"`
}
type GPUMemoryUsageHelper struct {
Total float64 `json:"total"`
Used float64 `json:"used"`
Percent float64 `json:"percent"`
GPUProcesses []GPUProcess `json:"gpuProcesses"` GPUProcesses [][]GPUProcess `json:"gpuProcesses"`
} }
type GPUProcess struct { type GPUProcess struct {
Pid string `json:"pid"` Pid string `json:"pid"`
Type string `json:"type"` Type string `json:"type"`

30
agent/app/service/monitor.go
View file

@ -165,24 +165,27 @@ func (m *MonitorService) LoadGPUMonitorData(req dto.MonitorGPUSearch) (dto.Monit
data.Date = append(data.Date, gpu.CreatedAt) data.Date = append(data.Date, gpu.CreatedAt)
data.GPUValue = append(data.GPUValue, gpu.GPUUtil) data.GPUValue = append(data.GPUValue, gpu.GPUUtil)
data.TemperatureValue = append(data.TemperatureValue, gpu.Temperature) data.TemperatureValue = append(data.TemperatureValue, gpu.Temperature)
powerItem := dto.GPUPowerUsageHelper{ data.PowerUsed = append(data.PowerUsed, gpu.PowerDraw)
Total: gpu.MaxPowerLimit, data.PowerTotal = append(data.PowerTotal, gpu.MaxPowerLimit)
Used: gpu.PowerDraw, if gpu.MaxPowerLimit != 0 {
data.PowerPercent = append(data.PowerPercent, gpu.PowerDraw/gpu.MaxPowerLimit*100)
} else {
data.PowerPercent = append(data.PowerPercent, float64(0))
} }
if powerItem.Total != 0 {
powerItem.Percent = powerItem.Used / powerItem.Total data.MemoryTotal = append(data.MemoryTotal, gpu.MemTotal)
} data.MemoryUsed = append(data.MemoryUsed, gpu.MemUsed)
data.PowerValue = append(data.PowerValue, powerItem) if gpu.MemTotal != 0 {
memItem := dto.GPUMemoryUsageHelper{ data.MemoryPercent = append(data.MemoryPercent, gpu.MemUsed/gpu.MemTotal*100)
Total: gpu.MemTotal, } else {
Used: gpu.MemUsed, data.MemoryPercent = append(data.MemoryPercent, float64(0))
Percent: gpu.MemUsed / gpu.MemTotal * 100,
} }
var process []dto.GPUProcess var process []dto.GPUProcess
if err := json.Unmarshal([]byte(gpu.Processes), &process); err == nil { if err := json.Unmarshal([]byte(gpu.Processes), &process); err == nil {
memItem.GPUProcesses = process data.GPUProcesses = append(data.GPUProcesses, process)
} else {
data.GPUProcesses = append(data.GPUProcesses, []dto.GPUProcess{})
} }
data.MemoryValue = append(data.MemoryValue, memItem)
data.SpeedValue = append(data.SpeedValue, gpu.FanSpeed) data.SpeedValue = append(data.SpeedValue, gpu.FanSpeed)
} }
return data, nil return data, nil
@ -606,7 +609,6 @@ func saveXPUDataToDB() {
for _, xpuItem := range xpuInfo.Xpu { for _, xpuItem := range xpuInfo.Xpu {
item := model.MonitorGPU{ item := model.MonitorGPU{
ProductName: fmt.Sprintf("%d - %s", xpuItem.Basic.DeviceID, xpuItem.Basic.DeviceName), ProductName: fmt.Sprintf("%d - %s", xpuItem.Basic.DeviceID, xpuItem.Basic.DeviceName),
GPUUtil: loadGPUInfoFloat(xpuItem.Stats.MemoryUtil),
Temperature: loadGPUInfoFloat(xpuItem.Stats.Temperature), Temperature: loadGPUInfoFloat(xpuItem.Stats.Temperature),
PowerDraw: loadGPUInfoFloat(xpuItem.Stats.Power), PowerDraw: loadGPUInfoFloat(xpuItem.Stats.Power),
MemUsed: loadGPUInfoFloat(xpuItem.Stats.MemoryUsed), MemUsed: loadGPUInfoFloat(xpuItem.Stats.MemoryUsed),

20
frontend/src/api/interface/host.ts
View file

@ -174,20 +174,14 @@ export namespace Host {
date: Array<Date>; date: Array<Date>;
gpuValue: Array<number>; gpuValue: Array<number>;
temperatureValue: Array<number>; temperatureValue: Array<number>;
powerValue: Array<GPUPowerUsageHelper>; powerTotal: Array<number>;
memoryValue: Array<GPUMemoryUsageHelper>; powerUsed: Array<number>;
powerPercent: Array<number>;
memoryTotal: Array<number>;
memoryUsed: Array<number>;
memoryPercent: Array<number>;
speedValue: Array<number>; speedValue: Array<number>;
} gpuProcesses: Array<Array<GPUProcess>>;
export interface GPUPowerUsageHelper {
total: number;
used: number;
percent: number;
}
export interface GPUMemoryUsageHelper {
total: number;
used: number;
percent: number;
gpuProcesses: Array<GPUProcess>;
} }
export interface GPUProcess { export interface GPUProcess {
pid: string; pid: string;

56
frontend/src/lang/modules/en.ts
View file

@ -680,42 +680,29 @@ const message = {
whiteListHelper: 'Restrict access to only IPs in the whitelist', whiteListHelper: 'Restrict access to only IPs in the whitelist',
}, },
gpu: { gpu: {
gpu: 'GPU Monitor', gpu: 'GPU Monitoring',
base: 'Basic Information', gpuHelper: 'The system did not detect NVIDIA-SMI or XPU-SMI commands. Please check and try again!',
gpuHelper: 'NVIDIA-SMI or XPU-SMI command not detected on the current system. Please check and try again!',
driverVersion: 'Driver Version',
cudaVersion: 'CUDA Version',
process: 'Process Information', process: 'Process Information',
type: 'Type', type: 'Type',
typeG: 'Graphics', typeG: 'Graphics',
typeC: 'Compute', typeC: 'Compute',
typeCG: 'Compute + Graphics', typeCG: 'Compute+Graphics',
processName: 'Process Name', processName: 'Process Name',
processMemoryUsage: 'Memory Usage', shr: 'Shared Memory',
temperatureHelper: 'High GPU temperature can cause GPU frequency throttling', temperatureHelper: 'High GPU temperature may cause GPU frequency reduction',
performanceStateHelper: 'From P0 (maximum performance) to P12 (minimum performance)', gpuUtil: 'GPU Utilization',
busID: 'Bus ID', temperature: 'Temperature',
persistenceMode: 'Persistence Mode', performanceState: 'Performance State',
enabled: 'Enabled', powerUsage: 'Power Consumption',
disabled: 'Disabled', memoryUsage: 'Memory Utilization',
persistenceModeHelper: fanSpeed: 'Fan Speed',
'Persistence mode allows quicker task responses but increases standby power consumption.', power: 'Power',
displayActive: 'Graphics Card Initialized', powerCurrent: 'Current Power',
displayActiveT: 'Yes', powerLimit: 'Power Limit',
displayActiveF: 'No', memory: 'Memory',
ecc: 'Error Correction and Check Technology', memoryUsed: 'Memory Used',
computeMode: 'Compute Mode', memoryTotal: 'Total Memory',
default: 'Default', percent: 'Utilization',
exclusiveProcess: 'Exclusive Process',
exclusiveThread: 'Exclusive Thread',
prohibited: 'Prohibited',
defaultHelper: 'Default: Processes can execute concurrently',
exclusiveProcessHelper:
'Exclusive Process: Only one CUDA context can use the GPU, but can be shared by multiple threads',
exclusiveThreadHelper: 'Exclusive Thread: Only one thread in a CUDA context can use the GPU',
prohibitedHelper: 'Prohibited: Processes are not allowed to execute simultaneously',
migModeHelper: 'Used to create MIG instances for physical isolation of the GPU at the user level.',
migModeNA: 'Not Supported',
}, },
mcp: { mcp: {
server: 'MCP Server', server: 'MCP Server',
@ -1235,13 +1222,6 @@ const message = {
down: 'Down', down: 'Down',
interval: 'Collection Interval', interval: 'Collection Interval',
intervalHelper: 'Please enter an appropriate monitoring collection interval (5 seconds - 12 hours)', intervalHelper: 'Please enter an appropriate monitoring collection interval (5 seconds - 12 hours)',
gpuUtil: 'GPU Utilization',
temperature: 'Temperature',
performanceState: 'Performance state',
powerUsage: 'Power usage',
memoryUsage: 'Memory usage',
fanSpeed: 'Fan speed',
}, },
terminal: { terminal: {
local: 'Local', local: 'Local',

60
frontend/src/lang/modules/es-es.ts
View file

@ -679,43 +679,29 @@ const message = {
whiteListHelper: 'Restringir el acceso solo a las IP incluidas en la lista blanca', whiteListHelper: 'Restringir el acceso solo a las IP incluidas en la lista blanca',
}, },
gpu: { gpu: {
gpu: 'Monitor de GPU', gpu: 'Monitoreo de GPU',
base: 'Información básica', gpuHelper: 'El sistema no detectó comandos NVIDIA-SMI o XPU-SMI. ¡Compruebe e inténtelo de nuevo!',
gpuHelper: process: 'Información del Proceso',
'No se detectó el comando NVIDIA-SMI o XPU-SMI en el sistema actual. ¡Por favor verifique e intente nuevamente!',
driverVersion: 'Versión del controlador',
cudaVersion: 'Versión de CUDA',
process: 'Información del proceso',
type: 'Tipo', type: 'Tipo',
typeG: 'Gráficos', typeG: 'Gráficos',
typeC: 'Cómputo', typeC: 'Cómputo',
typeCG: 'Cómputo + Gráficos', typeCG: 'Cómputo+Gráficos',
processName: 'Nombre del proceso', processName: 'Nombre del Proceso',
processMemoryUsage: 'Uso de memoria', shr: 'Memoria Compartida',
temperatureHelper: 'Una temperatura alta de la GPU puede causar reducción de frecuencia', temperatureHelper: 'La alta temperatura de la GPU puede causar una reducción de la frecuencia de la GPU',
performanceStateHelper: 'Desde P0 (máximo rendimiento) hasta P12 (mínimo rendimiento)', gpuUtil: 'Utilización de GPU',
busID: 'ID del bus', temperature: 'Temperatura',
persistenceMode: 'Modo de persistencia', performanceState: 'Estado de Rendimiento',
enabled: 'Habilitado', powerUsage: 'Consumo de Energía',
disabled: 'Deshabilitado', memoryUsage: 'Utilización de Memoria',
persistenceModeHelper: fanSpeed: 'Velocidad del Ventilador',
'El modo de persistencia permite respuestas más rápidas, pero incrementa el consumo en reposo.', power: 'Energía',
displayActive: 'Tarjeta gráfica inicializada', powerCurrent: 'Energía Actual',
displayActiveT: 'Sí', powerLimit: 'Límite de Energía',
displayActiveF: 'No', memory: 'Memoria',
ecc: 'Tecnología de corrección y verificación de errores', memoryUsed: 'Memoria Utilizada',
computeMode: 'Modo de cómputo', memoryTotal: 'Memoria Total',
default: 'Predeterminado', percent: 'Utilización',
exclusiveProcess: 'Proceso exclusivo',
exclusiveThread: 'Hilo exclusivo',
prohibited: 'Prohibido',
defaultHelper: 'Predeterminado: Los procesos pueden ejecutarse simultáneamente',
exclusiveProcessHelper:
'Proceso exclusivo: Solo un contexto CUDA puede usar la GPU, pero puede ser compartido por varios hilos',
exclusiveThreadHelper: 'Hilo exclusivo: Solo un hilo en un contexto CUDA puede usar la GPU',
prohibitedHelper: 'Prohibido: No se permite la ejecución simultánea de procesos',
migModeHelper: 'Se utiliza para crear instancias MIG y aislar físicamente la GPU a nivel de usuario.',
migModeNA: 'No compatible',
}, },
mcp: { mcp: {
server: 'Servidor MCP', server: 'Servidor MCP',
@ -1243,12 +1229,6 @@ const message = {
down: 'Bajada', down: 'Bajada',
interval: 'Intervalo de Recolección', interval: 'Intervalo de Recolección',
intervalHelper: 'Ingrese un intervalo de recolección de monitoreo apropiado (5 segundos - 12 horas)', intervalHelper: 'Ingrese un intervalo de recolección de monitoreo apropiado (5 segundos - 12 horas)',
gpuUtil: 'Uso de GPU',
temperature: 'Temperatura',
performanceState: 'Estado de rendimiento',
powerUsage: 'Consumo de energía',
memoryUsage: 'Uso de memoria',
fanSpeed: 'Velocidad del ventilador',
}, },
terminal: { terminal: {
local: 'Local', local: 'Local',

55
frontend/src/lang/modules/ja.ts
View file

@ -667,42 +667,30 @@ const message = {
whiteListHelper: 'ホワイトリスト内のIPのみアクセスを許可する', whiteListHelper: 'ホワイトリスト内のIPのみアクセスを許可する',
}, },
gpu: { gpu: {
gpu: 'GPUモニター', gpu: 'GPU 監視',
base: '基本情報',
gpuHelper: gpuHelper:
'現在のシステムでNVIDIA-SMIまたはXPU-SMIコマンドが検出されませんでした。確認して再試行してください！', 'システムが NVIDIA-SMI または XPU-SMI コマンドを検出しませんでした。確認して再試行してください！',
driverVersion: 'ドライバーバージョン',
cudaVersion: 'CUDAバージョン',
process: 'プロセス情報', process: 'プロセス情報',
type: 'タイプ', type: 'タイプ',
typeG: 'グラフィックス', typeG: 'グラフィックス',
typeC: 'コンピュート', typeC: 'コンピュート',
typeCG: 'コンピュート + グラフィックス', typeCG: 'コンピュート+グラフィックス',
processName: 'プロセス名', processName: 'プロセス名',
processMemoryUsage: 'メモリ使用量', shr: '共有メモリ',
temperatureHelper: '高いGPU温度はGPUの周波数制限を引き起こす可能性があります', temperatureHelper: 'GPU 温度が高いと GPU 周波数が低下する可能性があります',
performanceStateHelper: 'P0（最大性能）からP12（最小性能）まで', gpuUtil: 'GPU 使用率',
busID: 'バスID', temperature: '温度',
persistenceMode: '永続モード', performanceState: 'パフォーマンス状態',
enabled: '有効', powerUsage: '消費電力',
disabled: '無効', memoryUsage: 'メモリ使用率',
persistenceModeHelper: '永続モードはタスクの応答速度を速くしますが、待機時の消費電力が増加します。', fanSpeed: 'ファン速度',
displayActive: 'グラフィックカード初期化済み', power: '電力',
displayActiveT: 'はい', powerCurrent: '現在の電力',
displayActiveF: 'いいえ', powerLimit: '電力上限',
ecc: 'エラー訂正およびチェック技術', memory: 'メモリ',
computeMode: 'コンピュートモード', memoryUsed: '使用メモリ',
default: 'デフォルト', memoryTotal: '総メモリ',
exclusiveProcess: '専用プロセス', percent: '使用率',
exclusiveThread: '専用スレッド',
prohibited: '禁止',
defaultHelper: 'デフォルト：プロセスは並行して実行できます',
exclusiveProcessHelper:
'専用プロセス：1つのCUDAコンテキストのみがGPUを使用できますが、複数のスレッドで共有できます',
exclusiveThreadHelper: '専用スレッド：CUDAコンテキスト内の1つのスレッドのみがGPUを使用できます',
prohibitedHelper: '禁止：プロセスは同時に実行できません',
migModeHelper: 'ユーザーレベルでGPUの物理的分離を行うためのMIGインスタンスを作成するために使用されます。',
migModeNA: 'サポートされていません',
}, },
mcp: { mcp: {
server: 'MCP サーバー', server: 'MCP サーバー',
@ -1199,13 +1187,6 @@ const message = {
down: '下', down: '下',
interval: '収集間隔', interval: '収集間隔',
intervalHelper: '適切な監視収集間隔を入力してください（5秒 - 12時間）', intervalHelper: '適切な監視収集間隔を入力してください（5秒 - 12時間）',
gpuUtil: 'GPU利用',
temperature: '温度',
performanceState: 'パフォーマンス状態',
powerUsage: '電力使用量',
memoryUsage: 'メモリの使用',
fanSpeed: 'ファンの速度',
}, },
terminal: { terminal: {
local: 'ローカル', local: 'ローカル',

57
frontend/src/lang/modules/ko.ts
View file

@ -664,41 +664,29 @@ const message = {
whiteListHelper: '화이트리스트에 있는 IP만 접근 허용', whiteListHelper: '화이트리스트에 있는 IP만 접근 허용',
}, },
gpu: { gpu: {
gpu: 'GPU 모니터', gpu: 'GPU 모니터링',
base: '기본 정보', gpuHelper: '시스템에서 NVIDIA-SMI 또는 XPU-SMI 명령을 감지하지 못했습니다. 확인하고 다시 시도하세요!',
gpuHelper: '현재 시스템에서 NVIDIA-SMI 또는 XPU-SMI 명령이 감지되지 않았습니다. 확인 후 다시 시도하세요!',
driverVersion: '드라이버 버전',
cudaVersion: 'CUDA 버전',
process: '프로세스 정보', process: '프로세스 정보',
type: '유형', type: '유형',
typeG: '그래픽', typeG: '그래픽',
typeC: '연산', typeC: '컴퓨팅',
typeCG: '연산 + 그래픽', typeCG: '컴퓨팅+그래픽',
processName: '프로세스 이름', processName: '프로세스 이름',
processMemoryUsage: '메모리 사용량', shr: '공유 메모리',
temperatureHelper: 'GPU 온도가 높으면 GPU 주파수 제한이 발생할 수 있습니다.', temperatureHelper: 'GPU 온도가 높으면 GPU 주파수가 감소할 수 있습니다',
performanceStateHelper: 'P0(최대 성능)부터 P12(최소 성능)까지', gpuUtil: 'GPU 사용률',
busID: '버스 ID', temperature: '온도',
persistenceMode: '지속 모드', performanceState: '성능 상태',
enabled: '활성화됨', powerUsage: '전력 소비',
disabled: '비활성화됨', memoryUsage: '메모리 사용률',
persistenceModeHelper: '지속 모드는 작업 응답 속도를 빠르게 하지만 대기 전력 소비를 증가시킵니다.', fanSpeed: '팬 속도',
displayActive: '그래픽 카드 초기화됨', power: '전력',
displayActiveT: '예', powerCurrent: '현재 전력',
displayActiveF: '아니요', powerLimit: '전력 제한',
ecc: '오류 감지 및 수정 기술', memory: '메모리',
computeMode: '연산 모드', memoryUsed: '사용된 메모리',
default: '기본값', memoryTotal: '전체 메모리',
exclusiveProcess: '단독 프로세스', percent: '사용률',
exclusiveThread: '단독 스레드',
prohibited: '금지됨',
defaultHelper: '기본값: 프로세스가 동시에 실행될 수 있음',
exclusiveProcessHelper:
'단독 프로세스: 하나의 CUDA 컨텍스트만 GPU 를 사용할 수 있지만, 여러 스레드에서 공유 가능',
exclusiveThreadHelper: '단독 스레드: CUDA 컨텍스트의 하나의 스레드만 GPU 를 사용할 수 있음',
prohibitedHelper: '금지됨: 프로세스가 동시에 실행되는 것이 허용되지 않음',
migModeHelper: '사용자 수준에서 GPU 를 물리적으로 분리하는 MIG 인스턴스를 생성하는 데 사용됩니다.',
migModeNA: '지원되지 않음',
}, },
mcp: { mcp: {
server: 'MCP サーバー', server: 'MCP サーバー',
@ -1191,13 +1179,6 @@ const message = {
down: '다운', down: '다운',
interval: '수집 간격', interval: '수집 간격',
intervalHelper: '적절한 모니터링 수집 간격을 입력하세요 (5초 - 12시간)', intervalHelper: '적절한 모니터링 수집 간격을 입력하세요 (5초 - 12시간)',
gpuUtil: 'GPU 사용률',
temperature: '온도',
performanceState: '성능 상태',
powerUsage: '전력 사용량',
memoryUsage: '메모리 사용량',
fanSpeed: '팬 속도',
}, },
terminal: { terminal: {
local: '로컬', local: '로컬',

56
frontend/src/lang/modules/ms.ts
View file

@ -680,42 +680,29 @@ const message = {
whiteListHelper: 'Hadkan akses kepada hanya IP dalam senarai putih', whiteListHelper: 'Hadkan akses kepada hanya IP dalam senarai putih',
}, },
gpu: { gpu: {
gpu: 'Monitor GPU', gpu: 'Pemantauan GPU',
base: 'Maklumat Asas', gpuHelper: 'Sistem tidak mengesan arahan NVIDIA-SMI atau XPU-SMI. Sila periksa dan cuba lagi!',
gpuHelper: 'Perintah NVIDIA-SMI atau XPU-SMI tidak dikesan pada sistem semasa. Sila periksa dan cuba lagi!',
driverVersion: 'Versi Pemacu',
cudaVersion: 'Versi CUDA',
process: 'Maklumat Proses', process: 'Maklumat Proses',
type: 'Jenis', type: 'Jenis',
typeG: 'Grafik', typeG: 'Grafik',
typeC: 'Pengiraan', typeC: 'Pengiraan',
typeCG: 'Pengiraan + Grafik', typeCG: 'Pengiraan+Grafik',
processName: 'Nama Proses', processName: 'Nama Proses',
processMemoryUsage: 'Penggunaan Memori', shr: 'Memori Kongsi',
temperatureHelper: 'Suhu GPU yang tinggi boleh menyebabkan pelambatan frekuensi GPU', temperatureHelper: 'Suhu GPU tinggi boleh menyebabkan pengurangan frekuensi GPU',
performanceStateHelper: 'Dari P0 (prestasi maksimum) hingga P12 (prestasi minimum)', gpuUtil: 'Penggunaan GPU',
busID: 'ID Bas', temperature: 'Suhu',
persistenceMode: 'Mod Ketekalan', performanceState: 'Status Prestasi',
enabled: 'Diaktifkan', powerUsage: 'Penggunaan Kuasa',
disabled: 'Dilumpuhkan', memoryUsage: 'Penggunaan Memori',
persistenceModeHelper: fanSpeed: 'Kelajuan Kipas',
'Mod ketekalan membolehkan respons tugas lebih cepat tetapi meningkatkan penggunaan kuasa sedia.', power: 'Kuasa',
displayActive: 'Kad Grafik Dimulakan', powerCurrent: 'Kuasa Semasa',
displayActiveT: 'Ya', powerLimit: 'Had Kuasa',
displayActiveF: 'Tidak', memory: 'Memori',
ecc: 'Teknologi Pemeriksaan dan Pembetulan Ralat', memoryUsed: 'Memori Digunakan',
computeMode: 'Mod Pengiraan', memoryTotal: 'Jumlah Memori',
default: 'Asal', percent: 'Penggunaan',
exclusiveProcess: 'Proses Eksklusif',
exclusiveThread: 'Thread Eksklusif',
prohibited: 'Dilarang',
defaultHelper: 'Asal: Proses boleh dilaksanakan secara serentak',
exclusiveProcessHelper:
'Proses Eksklusif: Hanya satu konteks CUDA boleh menggunakan GPU, tetapi boleh dikongsi oleh berbilang thread',
exclusiveThreadHelper: 'Thread Eksklusif: Hanya satu thread dalam konteks CUDA boleh menggunakan GPU',
prohibitedHelper: 'Dilarang: Proses tidak dibenarkan dilaksanakan serentak',
migModeHelper: 'Digunakan untuk membuat contoh MIG bagi pengasingan fizikal GPU pada tahap pengguna.',
migModeNA: 'Tidak Disokong',
}, },
mcp: { mcp: {
server: 'Pelayan MCP', server: 'Pelayan MCP',
@ -1229,13 +1216,6 @@ const message = {
down: 'Turun', down: 'Turun',
interval: 'Selang Kumpulan', interval: 'Selang Kumpulan',
intervalHelper: 'Sila masukkan selang kumpulan pemantauan yang sesuai (5 saat - 12 jam)', intervalHelper: 'Sila masukkan selang kumpulan pemantauan yang sesuai (5 saat - 12 jam)',
gpuUtil: 'Penggunaan GPU',
temperature: 'Suhu',
performanceState: 'Keadaan prestasi',
powerUsage: 'Penggunaan kuasa',
memoryUsage: 'Penggunaan memori',
fanSpeed: 'Kelajuan kipas',
}, },
terminal: { terminal: {
local: 'Tempatan', local: 'Tempatan',

59
frontend/src/lang/modules/pt-br.ts
View file

@ -675,43 +675,29 @@ const message = {
whiteListHelper: 'Restringir o acesso apenas aos IPs na lista branca', whiteListHelper: 'Restringir o acesso apenas aos IPs na lista branca',
}, },
gpu: { gpu: {
gpu: 'Monitor de GPU', gpu: 'Monitoramento de GPU',
base: 'Informações Básicas', gpuHelper: 'O sistema não detectou comandos NVIDIA-SMI ou XPU-SMI. Verifique e tente novamente!',
gpuHelper:
'Comando NVIDIA-SMI ou XPU-SMI não detectado no sistema atual. Por favor, verifique e tente novamente!',
driverVersion: 'Versão do Driver',
cudaVersion: 'Versão do CUDA',
process: 'Informações do Processo', process: 'Informações do Processo',
type: 'Tipo', type: 'Tipo',
typeG: 'Gráficos', typeG: 'Gráficos',
typeC: 'Cálculo', typeC: 'Computação',
typeCG: 'Cálculo + Gráficos', typeCG: 'Computação+Gráficos',
processName: 'Nome do Processo', processName: 'Nome do Processo',
processMemoryUsage: 'Uso de Memória', shr: 'Memória Compartilhada',
temperatureHelper: 'Temperaturas altas da GPU podem causar limitação de frequência da GPU.', temperatureHelper: 'Alta temperatura da GPU pode causar redução na frequência da GPU',
performanceStateHelper: 'De P0 (máximo desempenho) a P12 (mínimo desempenho).', gpuUtil: 'Utilização da GPU',
busID: 'ID do Barramento', temperature: 'Temperatura',
persistenceMode: 'Modo de Persistência', performanceState: 'Estado de Desempenho',
enabled: 'Ativado', powerUsage: 'Consumo de Energia',
disabled: 'Desativado', memoryUsage: 'Utilização de Memória',
persistenceModeHelper: fanSpeed: 'Velocidade do Ventilador',
'O modo de persistência permite respostas mais rápidas às tarefas, mas aumenta o consumo de energia em standby.', power: 'Energia',
displayActive: 'Placa Gráfica Inicializada', powerCurrent: 'Energia Atual',
displayActiveT: 'Sim', powerLimit: 'Limite de Energia',
displayActiveF: 'Não', memory: 'Memória',
ecc: 'Tecnologia de Correção e Verificação de Erros', memoryUsed: 'Memória Usada',
computeMode: 'Modo de Cálculo', memoryTotal: 'Memória Total',
default: 'Padrão', percent: 'Utilização',
exclusiveProcess: 'Processo Exclusivo',
exclusiveThread: 'Thread Exclusivo',
prohibited: 'Proibido',
defaultHelper: 'Padrão: Processos podem ser executados simultaneamente.',
exclusiveProcessHelper:
'Processo Exclusivo: Apenas um contexto CUDA pode usar a GPU, mas pode ser compartilhado por múltiplas threads.',
exclusiveThreadHelper: 'Thread Exclusivo: Apenas uma thread em um contexto CUDA pode usar a GPU.',
prohibitedHelper: 'Proibido: Não é permitido que processos sejam executados simultaneamente.',
migModeHelper: 'Usado para criar instâncias MIG para isolamento físico da GPU no nível do usuário.',
migModeNA: 'Não Suportado',
}, },
mcp: { mcp: {
server: 'Servidor MCP', server: 'Servidor MCP',
@ -1223,13 +1209,6 @@ const message = {
down: 'Para baixo', down: 'Para baixo',
interval: 'Intervalo de Coleta', interval: 'Intervalo de Coleta',
intervalHelper: 'Insira um intervalo de coleta de monitoramento apropriado (5 segundos - 12 horas)', intervalHelper: 'Insira um intervalo de coleta de monitoramento apropriado (5 segundos - 12 horas)',
gpuUtil: 'Utilização da GPU',
temperature: 'Temperatura',
performanceState: 'Estado de desempenho',
powerUsage: 'Uso de energia',
memoryUsage: 'Uso de memória',
fanSpeed: 'Velocidade do ventilador',
}, },
terminal: { terminal: {
local: 'Local', local: 'Local',

57
frontend/src/lang/modules/ru.ts
View file

@ -674,42 +674,28 @@ const message = {
}, },
gpu: { gpu: {
gpu: 'Мониторинг GPU', gpu: 'Мониторинг GPU',
base: 'Основная информация', gpuHelper: 'Система не обнаружила команды NVIDIA-SMI или XPU-SMI. Проверьте и повторите попытку!',
gpuHelper: 'Команда NVIDIA-SMI или XPU-SMI не обнаружена в текущей системе. Проверьте и попробуйте снова!', process: 'Информация о Процессе',
driverVersion: 'Версия драйвера',
cudaVersion: 'Версия CUDA',
process: 'Информация о процессе',
type: 'Тип', type: 'Тип',
typeG: 'Графика', typeG: 'Графика',
typeC: 'Вычисления', typeC: 'Вычисления',
typeCG: 'Вычисления + Графика', typeCG: 'Вычисления+Графика',
processName: 'Имя процесса', processName: 'Имя Процесса',
processMemoryUsage: 'Использование памяти', shr: 'Общая Память',
temperatureHelper: 'Высокая температура GPU может вызвать снижение частоты GPU', temperatureHelper: 'Высокая температура GPU может вызвать снижение частоты GPU',
performanceStateHelper: 'От P0 (максимальная производительность) до P12 (минимальная производительность)', gpuUtil: 'Использование GPU',
busID: 'ID шины', temperature: 'Температура',
persistenceMode: 'Режим постоянства', performanceState: 'Состояние Производительности',
enabled: 'Включен', powerUsage: 'Потребление Мощности',
disabled: 'Выключен', memoryUsage: 'Использование Памяти',
persistenceModeHelper: fanSpeed: 'Скорость Вентилятора',
'Режим постоянства позволяет быстрее реагировать на задачи, но увеличивает потребление энергии в режиме ожидания.', power: 'Мощность',
displayActive: 'Инициализация видеокарты', powerCurrent: 'Текущая Мощность',
displayActiveT: 'Да', powerLimit: 'Лимит Мощности',
displayActiveF: 'Нет', memory: 'Память',
ecc: 'Технология проверки и коррекции ошибок (ECC)', memoryUsed: 'Использованная Память',
computeMode: 'Режим вычислений', memoryTotal: 'Общая Память',
default: 'По умолчанию', percent: 'Использование',
exclusiveProcess: 'Исключительный процесс',
exclusiveThread: 'Исключительный поток',
prohibited: 'Запрещено',
defaultHelper: 'По умолчанию: процессы могут выполняться одновременно',
exclusiveProcessHelper:
'Исключительный процесс: только один контекст CUDA может использовать GPU, но его могут разделять несколько потоков',
exclusiveThreadHelper: 'Исключительный поток: только один поток в контексте CUDA может использовать GPU',
prohibitedHelper: 'Запрещено: процессам не разрешено выполняться одновременно',
migModeHelper:
'Используется для создания MIG-инстансов для физической изоляции GPU на уровне пользователя.',
migModeNA: 'Не поддерживается',
}, },
mcp: { mcp: {
server: 'Сервер MCP', server: 'Сервер MCP',
@ -1225,13 +1211,6 @@ const message = {
down: 'Входящий', down: 'Входящий',
interval: 'Интервал Сбора', interval: 'Интервал Сбора',
intervalHelper: 'Пожалуйста, введите подходящий интервал сбора мониторинга (5 секунд - 12 часов)', intervalHelper: 'Пожалуйста, введите подходящий интервал сбора мониторинга (5 секунд - 12 часов)',
gpuUtil: 'Использование GPU',
temperature: 'Температура',
performanceState: 'Состояние производительности',
powerUsage: 'Потребление энергии',
memoryUsage: 'Использование памяти',
fanSpeed: 'Скорость вентилятора',
}, },
terminal: { terminal: {
local: 'Локальный', local: 'Локальный',

60
frontend/src/lang/modules/tr.ts
View file

@ -687,44 +687,29 @@ const message = {
whiteListHelper: 'Erişimi yalnızca beyaz listedeki IPlerle sınırlayın', whiteListHelper: 'Erişimi yalnızca beyaz listedeki IPlerle sınırlayın',
}, },
gpu: { gpu: {
gpu: 'GPU Monitörü', gpu: 'GPU İzleme',
base: 'Temel Bilgiler', gpuHelper: 'Sistem NVIDIA-SMI veya XPU-SMI komutlarını algılamadı. Lütfen kontrol edip tekrar deneyin!',
gpuHelper: process: 'İşlem Bilgisi',
'Mevcut sistemde NVIDIA-SMI veya XPU-SMI komutu algılanmadı. Lütfen kontrol edin ve tekrar deneyin!',
driverVersion: 'Sürücü Sürümü',
cudaVersion: 'CUDA Sürümü',
process: 'İşlem Bilgileri',
type: 'Tür', type: 'Tür',
typeG: 'Grafik', typeG: 'Grafik',
typeC: 'Hesaplama', typeC: 'Hesaplama',
typeCG: 'Hesaplama + Grafik', typeCG: 'Hesaplama+Grafik',
processName: 'İşlem Adı', processName: 'İşlem Adı',
processMemoryUsage: 'Bellek Kullanımı', shr: 'Paylaşılan Bellek',
temperatureHelper: 'Yüksek GPU sıcaklığı GPU frekans kısıtlamasına neden olabilir', temperatureHelper: 'Yüksek GPU sıcaklığı GPU frekansında düşüşe neden olabilir',
performanceStateHelper: 'P0dan (maksimum performans) P12ye (minimum performans) kadar', gpuUtil: 'GPU Kullanımı',
busID: 'Bus ID', temperature: 'Sıcaklık',
persistenceMode: 'Kalıcılık Modu', performanceState: 'Performans Durumu',
enabled: 'Etkin', powerUsage: 'Güç Tüketimi',
disabled: 'Devre Dışı', memoryUsage: 'Bellek Kullanımı',
persistenceModeHelper: fanSpeed: 'Fan Hızı',
'Kalıcılık modu daha hızlı görev yanıtlarına izin verir ancak bekleme güç tüketimini artırır.', power: 'Güç',
displayActive: 'Grafik Kartı Başlatıldı', powerCurrent: 'Mevcut Güç',
displayActiveT: 'Evet', powerLimit: 'Güç Limiti',
displayActiveF: 'Hayır', memory: 'Bellek',
ecc: 'Hata Düzeltme ve Kontrol Teknolojisi', memoryUsed: 'Kullanılan Bellek',
computeMode: 'Hesaplama Modu', memoryTotal: 'Toplam Bellek',
default: 'Varsayılan', percent: 'Kullanım',
exclusiveProcess: 'Özel İşlem',
exclusiveThread: 'Özel Thread',
prohibited: 'Yasaklı',
defaultHelper: 'Varsayılan: İşlemler eşzamanlı olarak yürütülebilir',
exclusiveProcessHelper:
'Özel İşlem: Yalnızca bir CUDA bağlamı GPUyu kullanabilir, ancak birden fazla thread tarafından paylaşılabilir',
exclusiveThreadHelper: 'Özel Thread: CUDA bağlamında yalnızca bir thread GPUyu kullanabilir',
prohibitedHelper: 'Yasaklı: İşlemlerin eşzamanlı yürütülmesine izin verilmez',
migModeHelper:
'Kullanıcı düzeyinde GPUnun fiziksel izolasyonu için MIG örnekleri oluşturmak için kullanılır.',
migModeNA: 'Desteklenmiyor',
}, },
mcp: { mcp: {
server: 'MCP Sunucusu', server: 'MCP Sunucusu',
@ -1250,13 +1235,6 @@ const message = {
down: 'Aşağı', down: 'Aşağı',
interval: 'Toplama Aralığı', interval: 'Toplama Aralığı',
intervalHelper: 'Lütfen uygun bir izleme toplama aralığı girin (5 saniye - 12 saat)', intervalHelper: 'Lütfen uygun bir izleme toplama aralığı girin (5 saniye - 12 saat)',
gpuUtil: 'GPU Kullanımı',
temperature: 'Sıcaklık',
performanceState: 'Performans durumu',
powerUsage: 'Güç kullanımı',
memoryUsage: 'Bellek kullanımı',
fanSpeed: 'Fan hızı',
}, },
terminal: { terminal: {
local: 'Yerel', local: 'Yerel',

61
frontend/src/lang/modules/zh-Hant.ts
View file

@ -654,40 +654,28 @@ const message = {
}, },
gpu: { gpu: {
gpu: 'GPU 監控', gpu: 'GPU 監控',
base: '基礎資訊', gpuHelper: '目前系統未偵測到 NVIDIA-SMI 或者 XPU-SMI 指令，請檢查後重試！',
gpuHelper: '目前系統未檢測到 NVIDIA-SMI 或者 XPU-SMI 指令，請檢查後重試！',
driverVersion: '驅動版本',
cudaVersion: 'CUDA 版本',
process: '行程資訊', process: '行程資訊',
type: '類型', type: '類型',
typeG: '圖形', typeG: '圖形',
typeC: '計算', typeC: '計算',
typeCG: '計算+圖形', typeCG: '計算+圖形',
processName: '行程名稱', processName: '行程名稱',
processMemoryUsage: '記憶體使用', shr: '共享顯存',
temperatureHelper: 'GPU 溫度過高會導致 GPU 頻率下降', temperatureHelper: 'GPU 溫度過高會導致 GPU 頻率下降',
performanceStateHelper: '從 P0 (最大性能) 到 P12 (最小性能)', gpuUtil: 'GPU 使用率',
busID: '匯流排地址', temperature: '溫度',
persistenceMode: '持續模式', performanceState: '效能狀態',
enabled: '開啟', powerUsage: '功耗',
disabled: '關閉', memoryUsage: '顯存使用率',
persistenceModeHelper: '持續模式能更加快速地響應任務，但相應待機功耗也會增加', fanSpeed: '風扇轉速',
displayActive: '顯示卡初始化', power: '功率',
displayActiveT: '是', powerCurrent: '目前功率',
displayActiveF: '否', powerLimit: '功率上限',
ecc: '是否開啟錯誤檢查和糾正技術', memory: '顯存',
computeMode: '計算模式', memoryUsed: '顯存使用',
default: '預設', memoryTotal: '顯存總計',
exclusiveProcess: '行程排他', percent: '使用率',
exclusiveThread: '執行緒排他',
prohibited: '禁止',
defaultHelper: '預設: 行程可以並發執行',
exclusiveProcessHelper: '行程排他: 只有一個 CUDA 上下文可以使用 GPU， 但可以由多個執行緒共享',
exclusiveThreadHelper: '執行緒排他: 只有一個執行緒在 CUDA 上下文中可以使用 GPU',
prohibitedHelper: '禁止: 不允許行程同時執行',
migModeHelper: '用於建立 MIG 實例，在使用者層實現 GPU 的物理隔離。',
migModeNA: '不支援',
shr: '共享 GPU',
}, },
mcp: { mcp: {
server: 'MCP Server', server: 'MCP Server',
@ -1170,13 +1158,6 @@ const message = {
down: '下行', down: '下行',
interval: '採集間隔', interval: '採集間隔',
intervalHelper: '請輸入合適的監控採集時間間隔（5秒 - 12小時）', intervalHelper: '請輸入合適的監控採集時間間隔（5秒 - 12小時）',
gpuUtil: 'GPU 使用率',
temperature: '溫度',
performanceState: '性能狀態',
powerUsage: '功耗',
memoryUsage: '視訊記憶體使用率',
fanSpeed: '風扇轉速',
}, },
terminal: { terminal: {
local: '本機', local: '本機',
@ -2190,19 +2171,19 @@ const message = {
defaultDoc: '預設文件', defaultDoc: '預設文件',
perserver: '並發限制', perserver: '並發限制',
perserverHelper: '限制目前站點最大並發數', perserverHelper: '限制目前站點最大並發數',
perip: '單IP限制', perip: '單 IP 限制',
peripHelper: '限制單個IP訪問最大並發數', peripHelper: '限制單個 IP 訪問最大並發數',
rate: '流量限制', rate: '流量限制',
rateHelper: '限制每個請求的流量上限(單位:KB)', rateHelper: '限制每個請求的流量上限(單位:KB)',
limitHelper: '啟用流量控制', limitHelper: '啟用流量控制',
other: '其他', other: '其他',
currentSSL: '目前證書', currentSSL: '目前證書',
dnsAccount: 'DNS帳號', dnsAccount: 'DNS 帳號',
applySSL: '證書申請', applySSL: '證書申請',
SSLList: '證書列表', SSLList: '證書列表',
createDnsAccount: 'DNS帳戶', createDnsAccount: 'DNS 帳戶',
aliyun: '阿里雲DNS', aliyun: '阿里雲 DNS',
aliEsa: '阿里雲ESA', aliEsa: '阿里雲 ESA',
manual: '手動解析', manual: '手動解析',
key: '金鑰', key: '金鑰',
check: '查看', check: '查看',

57
frontend/src/lang/modules/zh.ts
View file

@ -655,40 +655,28 @@ const message = {
}, },
gpu: { gpu: {
gpu: 'GPU 监控', gpu: 'GPU 监控',
base: '基础信息',
gpuHelper: '当前系统未检测到 NVIDIA-SMI 或者 XPU-SMI 指令，请检查后重试！', gpuHelper: '当前系统未检测到 NVIDIA-SMI 或者 XPU-SMI 指令，请检查后重试！',
driverVersion: '驱动版本',
cudaVersion: 'CUDA 版本',
process: '进程信息', process: '进程信息',
type: '类型', type: '类型',
typeG: '图形', typeG: '图形',
typeC: '计算', typeC: '计算',
typeCG: '计算+图形', typeCG: '计算+图形',
processName: '进程名称', processName: '进程名称',
processMemoryUsage: '显存使用',
temperatureHelper: 'GPU 温度过高会导致 GPU 频率下降',
performanceStateHelper: '从 P0 (最大性能) 到 P12 (最小性能)',
busID: '总线地址',
persistenceMode: '持续模式',
enabled: '开启',
disabled: '关闭',
persistenceModeHelper: '持续模式能更加快速地响应任务，但相应待机功耗也会增加',
displayActive: '显卡初始化',
displayActiveT: '是',
displayActiveF: '否',
ecc: '是否开启错误检查和纠正技术',
computeMode: '计算模式',
default: '默认',
exclusiveProcess: '进程排他',
exclusiveThread: '线程排他',
prohibited: '禁止',
defaultHelper: '默认: 进程可以并发执行',
exclusiveProcessHelper: '进程排他: 只有一个 CUDA 上下文可以使用 GPU, 但可以由多个线程共享',
exclusiveThreadHelper: '线程排他: 只有一个线程在 CUDA 上下文中可以使用 GPU',
prohibitedHelper: '禁止: 不允许进程同时执行',
migModeHelper: '用于创建 MIG 实例，在用户层实现 GPU 的物理隔离。',
migModeNA: '不支持',
shr: '共享显存', shr: '共享显存',
temperatureHelper: 'GPU 温度过高会导致 GPU 频率下降',
gpuUtil: 'GPU 使用率',
temperature: '温度',
performanceState: '性能状态',
powerUsage: '功耗',
memoryUsage: '显存使用率',
fanSpeed: '风扇转速',
power: '功率',
powerCurrent: '当前功率',
powerLimit: '功率上限',
memory: '显存',
memoryUsed: '显存使用',
memoryTotal: '显存总计',
percent: '使用率',
}, },
mcp: { mcp: {
server: 'MCP Server', server: 'MCP Server',
@ -1176,13 +1164,6 @@ const message = {
down: '下行', down: '下行',
interval: '采集间隔', interval: '采集间隔',
intervalHelper: '请输入合适的监控采集时间间隔（5秒 - 12小时）', intervalHelper: '请输入合适的监控采集时间间隔（5秒 - 12小时）',
gpuUtil: 'GPU 使用率',
temperature: '温度',
performanceState: '性能状态',
powerUsage: '功耗',
memoryUsage: '显存使用率',
fanSpeed: '风扇转速',
}, },
terminal: { terminal: {
local: '本机', local: '本机',
@ -2186,19 +2167,19 @@ const message = {
defaultDoc: '默认文档', defaultDoc: '默认文档',
perserver: '并发限制', perserver: '并发限制',
perserverHelper: '限制当前站点最大并发数', perserverHelper: '限制当前站点最大并发数',
perip: '单IP限制', perip: '单 IP 限制',
peripHelper: '限制单个IP访问最大并发数', peripHelper: '限制单个 IP 访问最大并发数',
rate: '流量限制', rate: '流量限制',
rateHelper: '限制每个请求的流量上限(单位:KB)', rateHelper: '限制每个请求的流量上限(单位:KB)',
limitHelper: '启用流量控制', limitHelper: '启用流量控制',
other: '其他', other: '其他',
currentSSL: '当前证书', currentSSL: '当前证书',
dnsAccount: 'DNS账号', dnsAccount: 'DNS 账号',
applySSL: '证书申请', applySSL: '证书申请',
SSLList: '证书列表', SSLList: '证书列表',
createDnsAccount: 'DNS账户', createDnsAccount: 'DNS 账户',
aliyun: '阿里云', aliyun: '阿里云',
aliEsa: '阿里云ESA', aliEsa: '阿里云 ESA',
manual: '手动解析', manual: '手动解析',
key: '密钥', key: '密钥',
check: '查看', check: '查看',

160
frontend/src/views/ai/gpu/index.vue
View file

@ -32,11 +32,11 @@
</el-card> </el-card>
</div> </div>
<el-row :gutter="7" v-if="options.length !== 0"> <el-row :gutter="7" v-if="options.length !== 0">
<el-col v-bind="gpuType === 'gpu' ? fullWidthProps : halfWidthProps"> <el-col :span="24">
<el-card class="card-interval" style="overflow: inherit"> <el-card class="card-interval" style="overflow: inherit">
<template #header> <template #header>
<div :class="mobile ? 'flx-wrap' : 'flex justify-between'"> <div :class="mobile ? 'flx-wrap' : 'flex justify-between'">
<span class="title">{{ $t('monitor.memoryUsage') }}</span> <span class="title">{{ $t('aiTools.gpu.memoryUsage') }}</span>
</div> </div>
</template> </template>
<div class="chart"> <div class="chart">
@ -55,7 +55,7 @@
<el-card class="card-interval" style="overflow: inherit"> <el-card class="card-interval" style="overflow: inherit">
<template #header> <template #header>
<div :class="mobile ? 'flx-wrap' : 'flex justify-between'"> <div :class="mobile ? 'flx-wrap' : 'flex justify-between'">
<span class="title">{{ $t('monitor.gpuUtil') }}</span> <span class="title">{{ $t('aiTools.gpu.gpuUtil') }}</span>
</div> </div>
</template> </template>
<div class="chart"> <div class="chart">
@ -74,7 +74,7 @@
<el-card class="card-interval" style="overflow: inherit"> <el-card class="card-interval" style="overflow: inherit">
<template #header> <template #header>
<div :class="mobile ? 'flx-wrap' : 'flex justify-between'"> <div :class="mobile ? 'flx-wrap' : 'flex justify-between'">
<span class="title">{{ $t('monitor.powerUsage') }}</span> <span class="title">{{ $t('aiTools.gpu.powerUsage') }}</span>
</div> </div>
</template> </template>
<div class="chart"> <div class="chart">
@ -93,7 +93,7 @@
<el-card class="card-interval" style="overflow: inherit"> <el-card class="card-interval" style="overflow: inherit">
<template #header> <template #header>
<div> <div>
{{ $t('monitor.temperature') }} {{ $t('aiTools.gpu.temperature') }}
<el-tooltip placement="top" :content="$t('aiTools.gpu.temperatureHelper')"> <el-tooltip placement="top" :content="$t('aiTools.gpu.temperatureHelper')">
<el-icon size="15"><InfoFilled /></el-icon> <el-icon size="15"><InfoFilled /></el-icon>
</el-tooltip> </el-tooltip>
@ -111,11 +111,11 @@
</div> </div>
</el-card> </el-card>
</el-col> </el-col>
<el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12" v-if="gpuType === 'gpu'"> <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
<el-card class="card-interval" style="overflow: inherit"> <el-card class="card-interval" style="overflow: inherit">
<template #header> <template #header>
<div :class="mobile ? 'flx-wrap' : 'flex justify-between'"> <div :class="mobile ? 'flx-wrap' : 'flex justify-between'">
<span class="title">{{ $t('monitor.fanSpeed') }}</span> <span class="title">{{ $t('aiTools.gpu.fanSpeed') }}</span>
</div> </div>
</template> </template>
<div class="chart"> <div class="chart">
@ -163,9 +163,6 @@ const mobile = computed(() => {
return globalStore.isMobile(); return globalStore.isMobile();
}); });
const fullWidthProps = { span: 24 };
const halfWidthProps = { xs: 24, sm: 24, md: 12, lg: 12, xl: 12 };
const loading = ref(false); const loading = ref(false);
const options = ref([]); const options = ref([]);
const gpuType = ref('gpu'); const gpuType = ref('gpu');
@ -216,12 +213,8 @@ const search = async () => {
return dateFormatWithoutYear(item); return dateFormatWithoutYear(item);
}); });
initCPUCharts(date, res.data.gpuValue || []); initCPUCharts(date, res.data.gpuValue || []);
initMemoryCharts(date, res.data.memoryValue || []); initMemoryCharts(date, res.data);
if (gpuType.value === 'gpu') { initPowerCharts(date, res.data);
initPowerCharts(date, res.data.powerValue || []);
} else {
initXpuPowerCharts(date, res.data.powerValue || []);
}
initSpeedCharts(date, res.data.speedValue || []); initSpeedCharts(date, res.data.speedValue || []);
initTemperatureCharts(date, res.data.temperatureValue || []); initTemperatureCharts(date, res.data.temperatureValue || []);
}) })
@ -239,55 +232,94 @@ function initCPUCharts(baseDate: any, items: any) {
xData: baseDate, xData: baseDate,
yData: [ yData: [
{ {
name: i18n.global.t('monitor.gpuUtil'), name: i18n.global.t('aiTools.gpu.gpuUtil'),
data: data, data: data,
}, },
], ],
formatStr: '%', formatStr: '%',
}; };
} }
function initMemoryCharts(baseDate: any, items: any) { function initMemoryCharts(baseDate: any, data: any) {
let lists = items.map(function (item: any) {
return { value: Number(item.percent.toFixed(2)), data: item };
});
lists = lists.length === 0 ? loadEmptyData2() : lists;
chartsOption.value['loadMemoryChart'] = { chartsOption.value['loadMemoryChart'] = {
xData: baseDate, xData: baseDate,
yData: [ yData: [
{ {
name: i18n.global.t('monitor.memoryUsage'), name: i18n.global.t('aiTools.gpu.memoryUsed'),
data: lists, data: data.memoryUsed,
},
{
name: i18n.global.t('aiTools.gpu.memoryTotal'),
data: data.memoryTotal,
},
{
name: i18n.global.t('aiTools.gpu.percent'),
data: data.memoryPercent,
yAxisIndex: 1,
}, },
], ],
yAxis: [
{ type: 'value', name: i18n.global.t('aiTools.gpu.memory') },
{
type: 'value',
name: i18n.global.t('aiTools.gpu.percent') + ' ( % )',
position: 'right',
alignTicks: true,
},
],
grid: mobile.value ? { left: '15%', right: '15%', bottom: '20%' } : null,
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
formatter: function (list: any) { formatter: function (list: any) {
return withMemoryProcess(list); const param = list[0];
const index = param.dataIndex;
let process = data.gpuProcesses?.length > index ? data.gpuProcesses[index] : [];
return withMemoryProcess(list, process);
}, },
}, },
formatStr: '%', formatStr: '%',
}; };
} }
function initPowerCharts(baseDate: any, items: any) { function initPowerCharts(baseDate: any, data: any) {
let list = items.map(function (item: any) {
return { value: Number(item.percent.toFixed(2)), data: item };
});
list = list.length === 0 ? loadEmptyData2() : list;
chartsOption.value['loadPowerChart'] = { chartsOption.value['loadPowerChart'] = {
xData: baseDate, xData: baseDate,
yData: [ yData: [
{ {
name: i18n.global.t('monitor.powerUsage'), name: i18n.global.t('aiTools.gpu.powerCurrent'),
data: list, data: data.powerUsed,
},
{
name: i18n.global.t('aiTools.gpu.powerLimit'),
data: data.powerTotal,
},
{
name: i18n.global.t('aiTools.gpu.percent'),
data: data.powerPercent,
yAxisIndex: 1,
}, },
], ],
yAxis: [
{ type: 'value', name: i18n.global.t('aiTools.gpu.power') },
{
type: 'value',
name: i18n.global.t('aiTools.gpu.percent') + ' ( % )',
position: 'right',
alignTicks: true,
},
],
grid: mobile.value ? { left: '15%', right: '15%', bottom: '20%' } : null,
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
formatter: function (list: any) { formatter: function (list: any) {
let res = loadDate(list[0].name); let res = loadDate(list[0].name);
for (const item of list) { for (const item of list) {
res += loadSeries(item, item.data.value, '%'); if (
res += `( ${item.data?.data.used} W / ${item.data?.data.total} W)<br/>`; item.seriesName === i18n.global.t('aiTools.gpu.powerCurrent') ||
item.seriesName === i18n.global.t('aiTools.gpu.powerLimit')
) {
res += loadSeries(item, item.data, 'W');
} else {
res += loadSeries(item, Number(item.data.toFixed(2)), '%');
}
} }
return res; return res;
}, },
@ -300,32 +332,6 @@ const quickJump = () => {
routerToName('HostMonitorSetting'); routerToName('HostMonitorSetting');
}; };
function initXpuPowerCharts(baseDate: any, items: any) {
let list = items.map(function (item: any) {
return { value: Number(item.used.toFixed(2)), data: item };
});
list = list.length === 0 ? loadEmptyData2() : list;
chartsOption.value['loadPowerChart'] = {
xData: baseDate,
yData: [
{
name: i18n.global.t('monitor.powerUsage'),
data: list,
},
],
tooltip: {
trigger: 'axis',
formatter: function (list: any) {
let res = loadDate(list[0].name);
for (const item of list) {
res += loadSeries(item, item.data.value, 'W');
}
return res;
},
},
formatStr: 'W',
};
}
function initTemperatureCharts(baseDate: any, items: any) { function initTemperatureCharts(baseDate: any, items: any) {
let temperatures = items.map(function (item: any) { let temperatures = items.map(function (item: any) {
return Number(item); return Number(item);
@ -335,7 +341,7 @@ function initTemperatureCharts(baseDate: any, items: any) {
xData: baseDate, xData: baseDate,
yData: [ yData: [
{ {
name: i18n.global.t('monitor.temperature'), name: i18n.global.t('aiTools.gpu.temperature'),
data: temperatures, data: temperatures,
}, },
], ],
@ -351,7 +357,7 @@ function initSpeedCharts(baseDate: any, items: any) {
xData: baseDate, xData: baseDate,
yData: [ yData: [
{ {
name: i18n.global.t('monitor.fanSpeed'), name: i18n.global.t('aiTools.gpu.fanSpeed'),
data: speeds, data: speeds,
}, },
], ],
@ -370,25 +376,18 @@ function loadEmptyDate(timeRange: any) {
function loadEmptyData() { function loadEmptyData() {
return [0, 0]; return [0, 0];
} }
function loadEmptyData2() {
return [
{ value: 0, data: { total: 0, used: 0 } },
{ value: 0, data: { total: 0, used: 0 } },
];
}
function withMemoryProcess(list: any) { function withMemoryProcess(list: any, process: any) {
let process;
let res = loadDate(list[0].name); let res = loadDate(list[0].name);
for (const item of list) { for (const item of list) {
if (item.data?.data) { if (
process = item.data?.data.gpuProcesses || []; item.seriesName === i18n.global.t('aiTools.gpu.memoryUsed') ||
item.seriesName === i18n.global.t('aiTools.gpu.memoryTotal')
) {
res += loadSeries(item, item.data, 'MiB');
} else {
res += loadSeries(item, Number(item.data.toFixed(2)), '%');
} }
res += loadSeries(item, item.data.value, '%');
res += `( ${item.data?.data.used} MiB / ${item.data?.data.total} MiB)<br/>`;
}
if (!process) {
return res;
} }
let title = gpuType.value === 'gpu' ? i18n.global.t('aiTools.gpu.type') : i18n.global.t('aiTools.gpu.shr'); let title = gpuType.value === 'gpu' ? i18n.global.t('aiTools.gpu.type') : i18n.global.t('aiTools.gpu.shr');
res += ` res += `
@ -399,11 +398,14 @@ function withMemoryProcess(list: any) {
<th style="padding: 6px 8px;">PID</th> <th style="padding: 6px 8px;">PID</th>
<th style="padding: 6px 8px;">${i18n.global.t('aiTools.gpu.processName')}</th> <th style="padding: 6px 8px;">${i18n.global.t('aiTools.gpu.processName')}</th>
<th style="padding: 6px 8px;">${title}</th> <th style="padding: 6px 8px;">${title}</th>
<th style="padding: 6px 8px;">${i18n.global.t('aiTools.gpu.processMemoryUsage')}</th> <th style="padding: 6px 8px;">${i18n.global.t('aiTools.gpu.memoryUsed')}</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
`; `;
if (!process) {
return res;
}
for (const row of process) { for (const row of process) {
res += ` res += `
<tr> <tr>
@ -417,7 +419,7 @@ function withMemoryProcess(list: any) {
${loadProcessType(row.type)} ${loadProcessType(row.type)}
</td> </td>
<td style="padding: 6px 8px; text-align: center;"> <td style="padding: 6px 8px; text-align: center;">
${row.usedMemory} ${row.usedMemory.replaceAll('MB', 'MiB')}
</td> </td>
</tr> </tr>
`; `;

18
frontend/src/views/home/status/index.vue
View file

@ -264,22 +264,22 @@
<el-col :xs="6" :sm="6" :md="3" :lg="3" :xl="3" align="center" v-if="isShow('gpu', index)"> <el-col :xs="6" :sm="6" :md="3" :lg="3" :xl="3" align="center" v-if="isShow('gpu', index)">
<el-popover :hide-after="20" :teleported="false" :width="450" v-if="chartsOption[`gpu${index}`]"> <el-popover :hide-after="20" :teleported="false" :width="450" v-if="chartsOption[`gpu${index}`]">
<el-descriptions :title="item.productName" direction="vertical" :column="3" size="small"> <el-descriptions :title="item.productName" direction="vertical" :column="3" size="small">
<el-descriptions-item :label="$t('monitor.gpuUtil')"> <el-descriptions-item :label="$t('aiTools.gpu.gpuUtil')">
{{ item.gpuUtil }} {{ item.gpuUtil }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item :label="$t('monitor.temperature')"> <el-descriptions-item :label="$t('aiTools.gpu.temperature')">
{{ item.temperature.replaceAll('C', '°C') }} {{ item.temperature.replaceAll('C', '°C') }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item :label="$t('monitor.performanceState')"> <el-descriptions-item :label="$t('aiTools.gpu.performanceState')">
{{ item.performanceState }} {{ item.performanceState }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item :label="$t('monitor.powerUsage')"> <el-descriptions-item :label="$t('aiTools.gpu.powerUsage')">
{{ item.powerUsage }} {{ item.powerUsage }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item :label="$t('monitor.memoryUsage')"> <el-descriptions-item :label="$t('aiTools.gpu.memoryUsage')">
{{ item.memoryUsage }} {{ item.memoryUsage }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item :label="$t('monitor.fanSpeed')"> <el-descriptions-item :label="$t('aiTools.gpu.fanSpeed')">
{{ item.fanSpeed }} {{ item.fanSpeed }}
</el-descriptions-item> </el-descriptions-item>
</el-descriptions> </el-descriptions>
@ -304,13 +304,13 @@
<el-col :xs="6" :sm="6" :md="3" :lg="3" :xl="3" align="center" v-if="isShow('xpu', index)"> <el-col :xs="6" :sm="6" :md="3" :lg="3" :xl="3" align="center" v-if="isShow('xpu', index)">
<el-popover :hide-after="20" :teleported="false" :width="400" v-if="chartsOption[`xpu${index}`]"> <el-popover :hide-after="20" :teleported="false" :width="400" v-if="chartsOption[`xpu${index}`]">
<el-descriptions :title="item.deviceName" direction="vertical" :column="3" size="small"> <el-descriptions :title="item.deviceName" direction="vertical" :column="3" size="small">
<el-descriptions-item :label="$t('monitor.temperature')"> <el-descriptions-item :label="$t('aiTools.gpu.temperature')">
{{ item.temperature }} {{ item.temperature }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item :label="$t('monitor.powerUsage')"> <el-descriptions-item :label="$t('aiTools.gpu.powerUsage')">
{{ item.power }} {{ item.power }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item :label="$t('monitor.memoryUsage')"> <el-descriptions-item :label="$t('aiTools.gpu.memoryUsage')">
{{ item.memoryUsed }}/{{ item.memory }} {{ item.memoryUsed }}/{{ item.memory }}
</el-descriptions-item> </el-descriptions-item>
</el-descriptions> </el-descriptions>