mirror of
https://github.com/fastapiadmin/FastapiAdmin.git
synced 2026-09-29 23:44:41 +00:00
style: 移除多余空行并统一代码格式
修复代码中的多余空行问题，统一字符串引号使用双引号，调整对象和数组的格式，优化代码缩进和换行，提升代码可读性和一致性
This commit is contained in:
zhangtao
@@ -1,11 +1,11 @@
|
||||
<template>
|
||||
<div class="app-container" >
|
||||
<div class="app-container">
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12" class="mb-4">
|
||||
<el-card :loading="loading" shadow="hover">
|
||||
<el-card :loading="loading" shadow="hover">
|
||||
<template #header>
|
||||
<div class="flex items-center gap-2">
|
||||
<el-icon><Cpu/></el-icon>
|
||||
<el-icon><Cpu /></el-icon>
|
||||
<span class="flex items-center gap-2">CPU使用情况</span>
|
||||
<el-tooltip content="展示CPU核心数及使用率">
|
||||
<el-icon><QuestionFilled /></el-icon>
|
||||
@@ -19,18 +19,23 @@
|
||||
<span>核心数</span>
|
||||
<el-tooltip :content="(server.cpu?.cpu_num || 0).toFixed(1)">
|
||||
<div class="text-center mb-4">
|
||||
<el-progress
|
||||
<el-progress
|
||||
type="circle"
|
||||
:percentage="100"
|
||||
:format="() => `${server.cpu?.cpu_num || 0}`"
|
||||
:format="() => `${server.cpu?.cpu_num || 0}`"
|
||||
/>
|
||||
|
||||
</div>
|
||||
</el-tooltip>
|
||||
<el-descriptions :column="1" border>
|
||||
<el-descriptions-item label="总核心数" >{{server.cpu?.cpu_num || 0}}</el-descriptions-item>
|
||||
<el-descriptions-item label="已用核心" >{{Math.floor((server.cpu?.used || 0) * server.cpu?.cpu_num / 100)}}</el-descriptions-item>
|
||||
<el-descriptions-item label="空闲核心" >{{Math.floor((server.cpu?.free || 0) * server.cpu?.cpu_num / 100)}}</el-descriptions-item>
|
||||
<el-descriptions-item label="总核心数">
|
||||
{{ server.cpu?.cpu_num || 0 }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="已用核心">
|
||||
{{ Math.floor(((server.cpu?.used || 0) * server.cpu?.cpu_num) / 100) }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="空闲核心">
|
||||
{{ Math.floor(((server.cpu?.free || 0) * server.cpu?.cpu_num) / 100) }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
</el-col>
|
||||
@@ -40,17 +45,29 @@
|
||||
<span>使用率</span>
|
||||
<el-tooltip :content="(server.cpu?.used || 0).toFixed(1) + '%'">
|
||||
<div class="text-center mb-4">
|
||||
<el-progress
|
||||
type="circle"
|
||||
:percentage="server.cpu?.used || 0"
|
||||
:status="server.cpu?.used > 80 ? 'exception' : server.cpu?.used > 60 ? 'warning' : 'success'"
|
||||
<el-progress
|
||||
type="circle"
|
||||
:percentage="server.cpu?.used || 0"
|
||||
:status="
|
||||
server.cpu?.used > 80
|
||||
? 'exception'
|
||||
: server.cpu?.used > 60
|
||||
? 'warning'
|
||||
: 'success'
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
<el-descriptions :column="1" border>
|
||||
<el-descriptions-item label="用户使用率" >{{(server.cpu?.used || 0).toFixed(1) + '%'}}</el-descriptions-item>
|
||||
<el-descriptions-item label="系统使用率" >{{(server.cpu?.sys || 0).toFixed(1) + '%'}}</el-descriptions-item>
|
||||
<el-descriptions-item label="当前空闲率" >{{(server.cpu?.free || 0).toFixed(1) + '%'}}</el-descriptions-item>
|
||||
<el-descriptions-item label="用户使用率">
|
||||
{{ (server.cpu?.used || 0).toFixed(1) + "%" }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="系统使用率">
|
||||
{{ (server.cpu?.sys || 0).toFixed(1) + "%" }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="当前空闲率">
|
||||
{{ (server.cpu?.free || 0).toFixed(1) + "%" }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
</el-col>
|
||||
@@ -59,7 +76,7 @@
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="mb-4">
|
||||
<el-card :loading="loading" shadow="hover">
|
||||
<el-card :loading="loading" shadow="hover">
|
||||
<template #header>
|
||||
<div class="flex items-center gap-2">
|
||||
<el-icon><Memo /></el-icon>
|
||||
@@ -76,17 +93,29 @@
|
||||
<span>系统内存</span>
|
||||
<el-tooltip :content="(server.mem?.usage || 0).toFixed(1) + '%'">
|
||||
<div class="text-center mb-4">
|
||||
<el-progress
|
||||
type="circle"
|
||||
:percentage="server.mem?.usage || 0"
|
||||
:status="server.mem?.usage > 80 ? 'exception' : server.mem?.usage > 60 ? 'warning' : 'success'"
|
||||
<el-progress
|
||||
type="circle"
|
||||
:percentage="server.mem?.usage || 0"
|
||||
:status="
|
||||
server.mem?.usage > 80
|
||||
? 'exception'
|
||||
: server.mem?.usage > 60
|
||||
? 'warning'
|
||||
: 'success'
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
<el-descriptions :column="1" border>
|
||||
<el-descriptions-item label="总内存" >{{server.mem?.total}}</el-descriptions-item>
|
||||
<el-descriptions-item label="已用内存" >{{server.mem?.used}}</el-descriptions-item>
|
||||
<el-descriptions-item label="空闲内存" >{{server.mem?.free}}</el-descriptions-item>
|
||||
<el-descriptions-item label="总内存">
|
||||
{{ server.mem?.total }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="已用内存">
|
||||
{{ server.mem?.used }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="空闲内存">
|
||||
{{ server.mem?.free }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
</el-col>
|
||||
@@ -96,17 +125,29 @@
|
||||
<span>Python内存</span>
|
||||
<el-tooltip :content="(server.py?.memory_usage || 0).toFixed(1) + '%'">
|
||||
<div class="text-center mb-4">
|
||||
<el-progress
|
||||
type="circle"
|
||||
:percentage="server.py?.memory_usage || 0"
|
||||
:status="server.py?.memory_usage > 80 ? 'exception' : server.py?.memory_usage > 60 ? 'warning' : 'success'"
|
||||
<el-progress
|
||||
type="circle"
|
||||
:percentage="server.py?.memory_usage || 0"
|
||||
:status="
|
||||
server.py?.memory_usage > 80
|
||||
? 'exception'
|
||||
: server.py?.memory_usage > 60
|
||||
? 'warning'
|
||||
: 'success'
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
<el-descriptions :column="1" border>
|
||||
<el-descriptions-item label="总内存" >{{server.py?.memory_total}}</el-descriptions-item>
|
||||
<el-descriptions-item label="已用内存" >{{server.py?.memory_used}}</el-descriptions-item>
|
||||
<el-descriptions-item label="空闲内存" >{{server.py?.memory_free}}</el-descriptions-item>
|
||||
<el-descriptions-item label="总内存">
|
||||
{{ server.py?.memory_total }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="已用内存">
|
||||
{{ server.py?.memory_used }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="空闲内存">
|
||||
{{ server.py?.memory_free }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
</el-col>
|
||||
@@ -115,7 +156,7 @@
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24" class="mb-4">
|
||||
<el-card :loading="loading" >
|
||||
<el-card :loading="loading">
|
||||
<template #header>
|
||||
<div class="flex items-center gap-2">
|
||||
<el-icon><Monitor /></el-icon>
|
||||
@@ -126,16 +167,24 @@
|
||||
</div>
|
||||
</template>
|
||||
<el-descriptions :column="2" border>
|
||||
<el-descriptions-item label="服务器名称">{{ server.sys?.computer_name || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="操作系统">{{ server.sys?.os_name || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="服务器IP">{{ server.sys?.computer_ip || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="系统架构">{{ server.sys?.os_arch || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="服务器名称">
|
||||
{{ server.sys?.computer_name || "-" }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="操作系统">
|
||||
{{ server.sys?.os_name || "-" }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="服务器IP">
|
||||
{{ server.sys?.computer_ip || "-" }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="系统架构">
|
||||
{{ server.sys?.os_arch || "-" }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24" class="mb-4">
|
||||
<el-card :loading="loading" class="shadow-sm">
|
||||
<el-card :loading="loading" class="shadow-sm">
|
||||
<template #header>
|
||||
<div class="flex items-center gap-2">
|
||||
<el-icon><Dish /></el-icon>
|
||||
@@ -146,12 +195,24 @@
|
||||
</div>
|
||||
</template>
|
||||
<el-descriptions :column="3" border>
|
||||
<el-descriptions-item label="Python名称">{{ server.py?.name || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="Python版本">{{ server.py?.version || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="启动时间">{{ server.py?.start_time || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="运行时长">{{ server.py?.run_time || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="安装路径">{{ server.py?.home || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="项目路径">{{ server.sys?.user_dir || '-' }}</el-descriptions-item>
|
||||
<el-descriptions-item label="Python名称">
|
||||
{{ server.py?.name || "-" }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="Python版本">
|
||||
{{ server.py?.version || "-" }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="启动时间">
|
||||
{{ server.py?.start_time || "-" }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="运行时长">
|
||||
{{ server.py?.run_time || "-" }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="安装路径">
|
||||
{{ server.py?.home || "-" }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="项目路径">
|
||||
{{ server.sys?.user_dir || "-" }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
</el-col>
|
||||
@@ -169,35 +230,19 @@
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</template>
|
||||
<el-table :data="server.disks" border >
|
||||
<el-table :data="server.disks" border>
|
||||
<template #empty>
|
||||
<el-empty :image-size="80" description="暂无数据" />
|
||||
</template>
|
||||
<el-table-column
|
||||
label="盘符路径"
|
||||
prop="dir_name"
|
||||
:show-overflow-tooltip="true"
|
||||
/>
|
||||
<el-table-column
|
||||
label="文件系统"
|
||||
prop="sys_type_name"
|
||||
align="center"
|
||||
width="100"
|
||||
/>
|
||||
<el-table-column
|
||||
label="盘符名称"
|
||||
prop="type_name"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="usage"
|
||||
label="使用率"
|
||||
align="center"
|
||||
>
|
||||
<el-table-column label="盘符路径" prop="dir_name" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="文件系统" prop="sys_type_name" align="center" width="100" />
|
||||
<el-table-column label="盘符名称" prop="type_name" />
|
||||
<el-table-column prop="usage" label="使用率" align="center">
|
||||
<template #default="{ row }">
|
||||
<!-- 使用 element-plus 的 Progress 组件 -->
|
||||
<div>
|
||||
<el-progress
|
||||
:percentage="Number(row.usage)"
|
||||
<el-progress
|
||||
:percentage="Number(row.usage)"
|
||||
:status="row.usage > 80 ? 'exception' : row.usage > 60 ? 'warning' : 'success'"
|
||||
:text-inside="true"
|
||||
:stroke-width="16"
|
||||
@@ -205,24 +250,9 @@
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="总大小"
|
||||
prop="total"
|
||||
align="center"
|
||||
width="100"
|
||||
/>
|
||||
<el-table-column
|
||||
label="可用大小"
|
||||
prop="free"
|
||||
align="center"
|
||||
width="100"
|
||||
/>
|
||||
<el-table-column
|
||||
label="已用大小"
|
||||
prop="used"
|
||||
align="center"
|
||||
width="100"
|
||||
/>
|
||||
<el-table-column label="总大小" prop="total" align="center" width="100" />
|
||||
<el-table-column label="可用大小" prop="free" align="center" width="100" />
|
||||
<el-table-column label="已用大小" prop="used" align="center" width="100" />
|
||||
</el-table>
|
||||
</el-card>
|
||||
</el-col>
|
||||
@@ -231,8 +261,7 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import ServerAPI, {type ServerInfo } from '@/api/module_monitor/server'
|
||||
|
||||
import ServerAPI, { type ServerInfo } from "@/api/module_monitor/server";
|
||||
|
||||
const loading = ref(false);
|
||||
const server = ref<ServerInfo>({
|
||||
@@ -240,33 +269,33 @@ const server = ref<ServerInfo>({
|
||||
cpu_num: 0,
|
||||
used: 0,
|
||||
sys: 0,
|
||||
free: 0
|
||||
free: 0,
|
||||
},
|
||||
mem: {
|
||||
total: '',
|
||||
used: '',
|
||||
free: '',
|
||||
usage: 0
|
||||
total: "",
|
||||
used: "",
|
||||
free: "",
|
||||
usage: 0,
|
||||
},
|
||||
sys: {
|
||||
computer_name: '',
|
||||
os_name: '',
|
||||
computer_ip: '',
|
||||
os_arch: '',
|
||||
user_dir: ''
|
||||
computer_name: "",
|
||||
os_name: "",
|
||||
computer_ip: "",
|
||||
os_arch: "",
|
||||
user_dir: "",
|
||||
},
|
||||
py: {
|
||||
name: '',
|
||||
version: '',
|
||||
start_time: '',
|
||||
run_time: '',
|
||||
home: '',
|
||||
memory_total: '',
|
||||
memory_used: '',
|
||||
memory_free: '',
|
||||
memory_usage: 0
|
||||
name: "",
|
||||
version: "",
|
||||
start_time: "",
|
||||
run_time: "",
|
||||
home: "",
|
||||
memory_total: "",
|
||||
memory_used: "",
|
||||
memory_free: "",
|
||||
memory_usage: 0,
|
||||
},
|
||||
disks: []
|
||||
disks: [],
|
||||
});
|
||||
|
||||
async function getList() {
|
||||
@@ -275,7 +304,7 @@ async function getList() {
|
||||
const response = await ServerAPI.getServer();
|
||||
server.value = response.data.data;
|
||||
} catch (error) {
|
||||
console.error('获取服务器信息失败:', error);
|
||||
console.error("获取服务器信息失败:", error);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user