split event log

This commit is contained in:
Julian Freeman
2025-11-26 19:49:37 -04:00
parent 9e6ad62a91
commit 79a796f037
2 changed files with 94 additions and 49 deletions

View File

@@ -21,6 +21,13 @@
>
<span class="nav-icon"></span> 蓝屏分析
</button>
<button
class="nav-item"
:class="{ active: currentTab === 'logs' }"
@click="currentTab = 'logs'"
>
<span class="nav-icon"></span> 系统日志
</button>
</nav>
<div class="sidebar-footer">
<span class="version">Pro v1.2</span>
@@ -46,9 +53,8 @@
</div>
</div>
<!-- 状态提示 -->
<!-- 状态提示 (移除了 scanFinished div 提示) -->
<div v-if="errorMsg" class="message-box error"> {{ errorMsg }}</div>
<div v-if="scanFinished" class="message-box success"> 扫描完成</div>
<input type="file" ref="fileInput" @change="handleFileImport" accept=".json" style="display: none" />
@@ -133,24 +139,25 @@
</div>
</div>
<!-- 5. 日志卡片 -->
<div v-if="report.events" class="card slide-up" :class="{ danger: report.events.length > 0 }">
<div class="card-header">
<h3> 关键日志</h3>
</div>
<div v-if="report.events.length > 0" class="list-container">
<div v-for="(evt, idx) in report.events" :key="idx" class="list-item warning-item">
<div class="item-header">
<span class="event-id">ID: {{ evt.event_id }}</span>
<span class="event-source" :title="evt.source">{{ evt.source }}</span>
<span class="event-time">{{ formatTime(evt.time_generated) }}</span>
</div>
<p class="description highlight">{{ evt.analysis_hint }}</p>
<p v-if="evt.message" class="description raw-message">{{ evt.message }}</p>
</div>
</div>
<div v-else class="good-news">无致命错误日志</div>
</div>
<!-- [已移除] 5. 蓝屏分析卡片 -->
<!-- 6. 关键日志 (在概览中只显示简报或完全移除留给独立Tab这里按需保留或移除) -->
<!-- 如果你希望概览完全不显示日志可以把下面这段也注释掉或移除 -->
<!-- 这里我保留了一个极简的日志状态卡片点击跳转 -->
<div class="card slide-up" @click="currentTab = 'logs'" style="cursor: pointer;">
<div class="card-header">
<h3> 系统日志概况</h3>
<span class="badge" :class="report.events && report.events.length > 0 ? 'badge-red' : 'badge-green'">
{{ report.events && report.events.length > 0 ? `${report.events.length} 条记录` : '无异常' }}
</span>
</div>
<div class="content-box">
<p class="description" v-if="report.events && report.events.length > 0">
最近30天发现关键错误点击查看详情
</p>
<p class="description" v-else>系统运行稳定</p>
</div>
</div>
</div>
</div>
@@ -224,6 +231,41 @@
</div>
</div>
<!-- TAB 3: 系统日志 -->
<div v-if="currentTab === 'logs'" class="tab-view logs-view">
<div class="view-header">
<h2>系统关键日志 (近30天)</h2>
<div class="actions-row">
<button class="secondary-btn" @click="startScan" :disabled="loading">🔄 刷新日志</button>
</div>
</div>
<div class="logs-container fade-in">
<div v-if="!report.events" class="empty-state">
<span v-if="loading">正在读取日志记录...</span>
<span v-else>请先点击全面体检刷新日志以获取数据</span>
</div>
<div v-else-if="report.events.length === 0" class="good-news large">
过去30天内未发现 Kernel-Power(41) WHEA(18/19) 等致命错误
</div>
<div v-else class="log-list-full">
<div v-for="(evt, idx) in report.events" :key="idx" class="log-card warning-item">
<div class="log-header">
<div class="log-meta">
<span class="event-id">ID: {{ evt.event_id }}</span>
<span class="event-time">{{ formatTime(evt.time_generated) }}</span>
</div>
<span class="event-source">{{ evt.source }}</span>
</div>
<div class="log-body">
<p class="description highlight">{{ evt.analysis_hint }}</p>
<p v-if="evt.message" class="description raw-message">{{ evt.message }}</p>
</div>
</div>
</div>
</div>
</div>
</main>
<!-- Toast 通知 -->
@@ -245,14 +287,15 @@ import { invoke } from '@tauri-apps/api/core';
import { listen } from '@tauri-apps/api/event';
// --- 状态管理 ---
const currentTab = ref('overview'); // 'overview' | 'bsod'
const currentTab = ref('overview'); // 'overview' | 'bsod' | 'logs'
// 概览相关
const emptyReport = () => ({ hardware: null, storage: null, events: null, minidumps: null, drivers: null, battery: null });
const report = ref(emptyReport());
const loading = ref(false);
const errorMsg = ref('');
const scanFinished = ref(false);
// [移除] scanFinished 状态变量,因为不再需要显示 div 提示
// const scanFinished = ref(false);
const fileInput = ref(null);
let unlistenFns = [];
@@ -270,7 +313,7 @@ let toastTimer = null;
const hasStorageDanger = computed(() => report.value?.storage?.some(d => d.is_danger) || false);
const isReportValid = computed(() => report.value && (report.value.hardware || report.value.storage));
// --- 辅助函数 ---
// --- 辅助函数 (保留) ---
function calculatePercent(used, total) { return (!total || total === 0) ? 0 : Math.round((used / total) * 100); }
function getProgressStyle(used, total) {
const percent = calculatePercent(used, total);
@@ -280,7 +323,7 @@ function getProgressStyle(used, total) {
function getBatteryColor(p) { return p < 50 ? '#ff4757' : (p < 80 ? '#ffa502' : '#2ed573'); }
function formatTime(t) { return !t ? "Unknown Time" : t.replace('T', ' ').substring(0, 19); }
// [新增] JS日期格式化函数yyyy-MM-dd HH:mm:ss
// JS日期格式化函数yyyy-MM-dd HH:mm:ss
function formatJsDate(date) {
const y = date.getFullYear();
const m = String(date.getMonth() + 1).padStart(2, '0');
@@ -309,10 +352,13 @@ async function exportReport() {
} catch (err) { triggerToast('导出失败', err.message, 'error'); }
}
function triggerImport() { fileInput.value.click(); }
function handleFileImport(event) { const file = event.target.files[0]; if (!file) return; const reader = new FileReader(); reader.onload = (e) => { try { const json = JSON.parse(e.target.result); if (json && (json.hardware || json.storage)) { report.value = json; scanFinished.value = false; triggerToast('导入成功', '已加载历史报告'); } else { triggerToast('导入失败', '文件格式错误', 'error'); } } catch (err) { triggerToast('解析失败', err.message, 'error'); } }; reader.readAsText(file); event.target.value = ''; }
function handleFileImport(event) { const file = event.target.files[0]; if (!file) return; const reader = new FileReader(); reader.onload = (e) => { try { const json = JSON.parse(e.target.result); if (json && (json.hardware || json.storage)) { report.value = json; triggerToast('导入成功', '已加载历史报告'); } else { triggerToast('导入失败', '文件格式错误', 'error'); } } catch (err) { triggerToast('解析失败', err.message, 'error'); } }; reader.readAsText(file); event.target.value = ''; }
async function startScan() {
report.value = emptyReport(); errorMsg.value = ''; scanFinished.value = false; loading.value = true;
// 只有在从未扫描过时清空,或者强制刷新
// report.value = emptyReport();
errorMsg.value = '';
loading.value = true;
if (unlistenFns.length > 0) { for (const fn of unlistenFns) fn(); unlistenFns = []; }
try {
unlistenFns.push(
@@ -322,7 +368,7 @@ async function startScan() {
await listen('report-minidumps', (e) => report.value.minidumps = e.payload),
await listen('report-battery', (e) => report.value.battery = e.payload),
await listen('report-events', (e) => report.value.events = e.payload),
await listen('diagnosis-finished', () => { loading.value = false; scanFinished.value = true; triggerToast('扫描完成', '体检已结束', 'success'); })
await listen('diagnosis-finished', () => { loading.value = false; triggerToast('体检完成', '所有项目检查完毕', 'success'); })
);
await invoke('run_diagnosis');
} catch (e) { loading.value = false; errorMsg.value = e; }
@@ -470,6 +516,7 @@ body { margin: 0; padding: 0; background-color: #f4f6f9; overflow: hidden; }
.badge-red { background-color: #ff4757; } .badge-green { background-color: #2ed573; } .badge-blue { background-color: #3498db; } .badge-gray { background-color: #95a5a6; }
.code-tag { background: #ff4757; color: white; padding: 1px 5px; border-radius: 3px; font-size: 0.75rem; font-weight: bold; }
.good-news { color: #27ae60; font-weight: 600; background: #eafaf1; padding: 12px; border-radius: 6px; border: 1px solid #d4efdf; text-align: center; font-size: 0.9rem; }
.good-news.large { padding: 40px; font-size: 1.1rem; }
.tip { margin-top: 12px; font-size: 0.85rem; color: #d35400; background: #fff3e0; padding: 10px; border-radius: 6px; border: 1px solid #ffe0b2; }
.progress-wrapper { margin-bottom: 12px; }
.progress-bar { width: 100%; height: 8px; background: #f1f3f5; border-radius: 4px; overflow: hidden; }
@@ -514,4 +561,16 @@ body { margin: 0; padding: 0; background-color: #f4f6f9; overflow: hidden; }
.message-box { padding: 10px 15px; border-radius: 6px; margin-bottom: 15px; font-size: 0.9rem; font-weight: 500; }
.message-box.success { background-color: #eafaf1; color: #27ae60; border: 1px solid #d4efdf; }
.message-box.error { background-color: #ffeaea; color: #c0392b; border: 1px solid #ffcccc; }
/* 新增日志视图样式 */
.logs-view { display: flex; flex-direction: column; height: 100%; }
.logs-container { flex: 1; overflow-y: auto; padding-right: 5px; }
.log-list-full { display: flex; flex-direction: column; gap: 15px; }
.log-card {
background: white; border-radius: 8px; padding: 15px 20px;
border: 1px solid #eaecf0; box-shadow: 0 2px 6px rgba(0,0,0,0.02);
}
.log-card.warning-item { border-left: 4px solid #fce588; }
.log-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.log-meta { display: flex; align-items: center; gap: 10px; }
</style>