feat: 优化日志组件并简化后端日志处理
为日志组件添加折叠功能并显示空状态提示 移除参数表单中冗余的后端日志调试信息
This commit is contained in:
@@ -1,14 +1,14 @@
|
|||||||
<template>
|
<template>
|
||||||
<q-card class="q-mt-md shadow-2">
|
<q-card class="q-mt-md shadow-2">
|
||||||
<q-card-section class="bg-blue-grey-1">
|
<q-card-section class="bg-blue-grey-1 cursor-pointer" @click="expanded = !expanded">
|
||||||
<div class="text-h6 text-blue-grey-9 flex items-center gap-2">
|
<div class="text-h6 text-blue-grey-9 flex items-center gap-2">
|
||||||
<q-icon name="terminal" />
|
<q-icon name="terminal" />
|
||||||
运行日志
|
运行日志
|
||||||
<q-space />
|
<q-space />
|
||||||
<q-btn flat dense round icon="delete" @click="clearLog" size="sm" />
|
<q-icon :name="expanded ? 'expand_less' : 'expand_more'" />
|
||||||
</div>
|
</div>
|
||||||
</q-card-section>
|
</q-card-section>
|
||||||
<q-card-section class="q-pa-none">
|
<div v-show="expanded" class="q-pa-none">
|
||||||
<div ref="logContainer" class="log-container">
|
<div ref="logContainer" class="log-container">
|
||||||
<div
|
<div
|
||||||
v-for="(log, index) in logs"
|
v-for="(log, index) in logs"
|
||||||
@@ -18,8 +18,9 @@
|
|||||||
<span class="log-time">{{ log.time }}</span>
|
<span class="log-time">{{ log.time }}</span>
|
||||||
<span class="log-message">{{ log.message }}</span>
|
<span class="log-message">{{ log.message }}</span>
|
||||||
</div>
|
</div>
|
||||||
|
<div v-if="logs.length === 0" class="log-empty">暂无日志</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</q-card-section>
|
|
||||||
</q-card>
|
</q-card>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -38,6 +39,7 @@ interface LogEntry {
|
|||||||
|
|
||||||
const logs = ref<LogEntry[]>([])
|
const logs = ref<LogEntry[]>([])
|
||||||
const logContainer = ref<HTMLElement | null>(null)
|
const logContainer = ref<HTMLElement | null>(null)
|
||||||
|
const expanded = ref(true)
|
||||||
|
|
||||||
const addLog = (level: LogEntry['level'], message: string) => {
|
const addLog = (level: LogEntry['level'], message: string) => {
|
||||||
const now = new Date()
|
const now = new Date()
|
||||||
@@ -103,4 +105,10 @@ defineExpose({
|
|||||||
.log-debug .log-message {
|
.log-debug .log-message {
|
||||||
color: #9cdcfe;
|
color: #9cdcfe;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.log-empty {
|
||||||
|
color: #666;
|
||||||
|
font-style: italic;
|
||||||
|
padding: 8px;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -384,23 +384,14 @@ const calculate = async () => {
|
|||||||
try {
|
try {
|
||||||
// 调用 pywebview 的 Python 函数
|
// 调用 pywebview 的 Python 函数
|
||||||
if (window.pywebview) {
|
if (window.pywebview) {
|
||||||
logRef.value?.addLog('info', '开始调用后端计算...')
|
|
||||||
const response = await window.pywebview.api.calculate(params)
|
const response = await window.pywebview.api.calculate(params)
|
||||||
logRef.value?.addLog('info', `后端返回 keys: ${Object.keys(response).join(', ')}`)
|
|
||||||
logRef.value?.addLog('info', `DEBUG_VERSION: ${response.DEBUG_VERSION || '无'}`)
|
|
||||||
logRef.value?.addLog('info', `后端返回: ${JSON.stringify(response).substring(0, 150)}`)
|
|
||||||
|
|
||||||
// 显示日志
|
// 显示后端日志
|
||||||
console.log('[DEBUG] response:', response)
|
|
||||||
const logs = response.logs
|
const logs = response.logs
|
||||||
if (Array.isArray(logs) && logs.length > 0) {
|
if (Array.isArray(logs) && logs.length > 0) {
|
||||||
logRef.value?.addLog('info', `收到 ${logs.length} 条日志`)
|
|
||||||
for (const log of logs) {
|
for (const log of logs) {
|
||||||
logRef.value?.addLog(log.level as any, log.message)
|
logRef.value?.addLog(log.level as any, log.message)
|
||||||
}
|
}
|
||||||
} else {
|
|
||||||
logRef.value?.addLog('warning', '后端未返回日志')
|
|
||||||
logRef.value?.addLog('warning', `response.logs = ${JSON.stringify(logs)}`)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
result.value = JSON.stringify(response, null, 2)
|
result.value = JSON.stringify(response, null, 2)
|
||||||
|
|||||||
Reference in New Issue
Block a user