feat: 解析结果始终展示+查看原始内容,不再需要点开折叠

This commit is contained in:
mediabot-pt
2026-07-01 13:07:07 +08:00
parent 6c304648dc
commit 274db098c8

View File

@@ -47,6 +47,15 @@
</div>
</el-card>
<!-- 原始内容弹窗 -->
<el-dialog v-model="rawVisible" :title="'原始内容 · ' + rawUrl" width="900px" :close-on-click-modal="false">
<div v-if="rawLoading" style="text-align:center;padding:40px;color:#909399">加载中...</div>
<pre v-else class="raw-content">{{ rawContent }}</pre>
<template #footer>
<el-button @click="rawVisible=false">关闭</el-button>
</template>
</el-dialog>
<!-- 脚本编辑弹窗 -->
<el-dialog v-model="configVisible" title="Groovy 脚本 · v{{ selectedConfig?.version }}" width="880px" :close-on-click-modal="false">
<div v-if="scriptLoading" style="text-align:center;padding:20px;color:#909399">加载中...</div>
@@ -94,9 +103,7 @@
<el-tag size="small" type="info">×{{ page.totalCount }}</el-tag>
</div>
<div style="display:flex;gap:6px">
<el-button size="small" @click="toggleView(page)">
{{ expandedSet.has(page.url) ? '收起' : '查看' }}
</el-button>
<el-button size="small" @click="viewRaw(page)">原始内容</el-button>
<el-button size="small" @click="reparseUrl(page)" :loading="reparsingUrls.has(page.url)">重新解析</el-button>
<el-popconfirm title="确认删除此访问结果?" @confirm="deleteResult(page)">
<template #reference>
@@ -107,26 +114,21 @@
</div>
</template>
<!-- 展开内容 -->
<template v-if="expandedSet.has(page.url)">
<!-- 解析结果 -->
<div v-if="page.parsed?.matched && page.parsed.extracted?.length" style="margin-bottom:8px">
<el-table :data="page.parsed.extracted" border stripe size="small" max-height="300">
<el-table-column type="index" label="#" width="45" />
<el-table-column v-for="col in Object.keys(page.parsed.extracted[0])" :key="col"
:prop="col" :label="col" min-width="100" show-overflow-tooltip>
<template #default="scope">
<span :style="scope.row[col]==null?'color:#c0c4cc':''">{{ scope.row[col] ?? '-' }}</span>
</template>
</el-table-column>
</el-table>
</div>
<div v-else style="color:#909399;font-size:12px;margin-bottom:8px">
{{ page.parsed?.message || '暂无提取数据' }}
</div>
</template>
<!-- 解析结果始终显示 -->
<div v-if="page.parsed?.matched && page.parsed.extracted?.length" style="margin-top:4px">
<el-table :data="page.parsed.extracted" border stripe size="small" max-height="300">
<el-table-column type="index" label="#" width="45" />
<el-table-column v-for="col in Object.keys(page.parsed.extracted[0])" :key="col"
:prop="col" :label="col" min-width="100" show-overflow-tooltip>
<template #default="scope">
<span :style="scope.row[col]==null?'color:#c0c4cc':''">{{ scope.row[col] ?? '-' }}</span>
</template>
</el-table-column>
</el-table>
</div>
<div v-else-if="page.parsed" style="color:#e6a23c;font-size:12px;margin-top:4px">
{{ page.parsed.message || '解析失败' }}
</div>
</el-card>
<div v-if="pages.length===0 && !loading" style="text-align:center;padding:60px;color:#909399">
@@ -161,6 +163,7 @@ const allResults = ref([])
const pageParsed = ref({})
const expandedSet = reactive(new Set())
const reparsingUrls = reactive(new Set())
const rawVisible = ref(false), rawLoading = ref(false), rawUrl = ref(''), rawContent = ref('')
const totalResults = computed(() => allResults.value.length)
@@ -290,6 +293,18 @@ const reparseUrl = async (page) => {
finally { reparsingUrls.delete(page.url) }
}
const viewRaw = async (page) => {
rawUrl.value = page.url
rawVisible.value = true
rawLoading.value = true
rawContent.value = ''
try {
const r = await api.accessResults.get(page.accessResultId)
rawContent.value = r.data?.content || '(空)'
} catch { rawContent.value = '加载失败' }
finally { rawLoading.value = false }
}
const deleteResult = async (page) => {
try {
await api.accessResults.delete(page.accessResultId)
@@ -315,6 +330,11 @@ onMounted(async () => {
</script>
<style scoped>
.raw-content {
background:#1e1e1e; color:#d4d4d4; padding:12px; border-radius:4px;
font-size:11px; line-height:1.4; margin:0; white-space:pre-wrap; word-break:break-all;
max-height:550px; overflow:auto;
}
.config-json {
background:#1e1e1e; color:#d4d4d4; padding:10px; border-radius:4px;
font-size:11px; line-height:1.5; margin:0; white-space:pre-wrap; word-break:break-all;