yescent/par
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: 列表页+详情页优化(站点名版本+搜索过滤+错误高亮+全部收起)

Browse Source
This commit is contained in:
mediabot-pt
2026-07-02 11:06:19 +08:00
parent 741eae236c
commit 07eb7c95b0
2 changed files with 44 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
web/src/views/AccessResultCheck.vue
View File

@@ -63,8 +63,15 @@
</div>
<!-- 右侧：URL卡片 -->
<div style="flex:1;overflow:auto;display:flex;flex-direction:column;gap:8px;min-height:0">
<el-card v-for="page in pages" :key="page.url" shadow="hover" size="small">
<div style="flex:1;overflow:auto;display:flex;flex-direction:column;min-height:0">
<!-- 搜索 + 全部收起 -->
<div style="display:flex;gap:8px;align-items:center;margin-bottom:4px;flex-shrink:0">
<el-input v-model="urlFilter" size="small" placeholder="搜索URL..." clearable style="flex:1" />
<el-button v-if="expanded.size>0" size="small" @click="expanded.clear()">全部收起</el-button>
</div>
<div style="display:flex;flex-direction:column;gap:8px;overflow:auto">
<el-card v-for="page in filteredPages" :key="page.url" shadow="hover" size="small">
<template #header>
<div style="display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px">
<div style="display:flex;align-items:center;gap:8px">
@@ -112,13 +119,14 @@
</el-table-column>
</el-table>
</div>
<div v-else-if="page.parsed" style="color:#e6a23c;font-size:12px;padding:4px 0">
<div v-else-if="page.parsed" style="background:#fef0f0;color:#f56c6c;font-size:12px;padding:6px 8px;border-radius:4px;white-space:pre-wrap;word-break:break-all">
{{ page.parsed.message || '解析失败' }}
</div>
<div v-else style="color:#909399;font-size:12px;padding:4px 0">未解析</div>
</el-card>
<div v-if="pages.length===0 && !loading" style="text-align:center;padding:60px;color:#909399">暂无访问结果</div>
<div v-if="filteredPages.length===0 && !loading" style="text-align:center;padding:60px;color:#909399">暂无访问结果</div>
</div>
</div>
</div>
@@ -140,7 +148,7 @@ import { Loading } from '@element-plus/icons-vue'
const route = useRoute()
const siteId = route.params.siteId
const loading = ref(false), parseLoading = ref(false), scriptExpanded = ref(true), historyVersion = ref(null)
const loading = ref(false), parseLoading = ref(false), scriptExpanded = ref(true), historyVersion = ref(null), urlFilter = ref('')
const selectedConfigId = ref(null), selectedConfig = ref(null)
const scriptContent = ref(''), saving = ref(false), approving = ref(false), rejecting = ref(false)
const allConfigVersions = ref([]), allResults = ref([])
@@ -149,6 +157,11 @@ const rawVisible = ref(false), rawLoading = ref(false), rawContent = ref('')
const totalResults = computed(() => allResults.value.length)
const filteredPages = computed(() => {
const f = urlFilter.value.toLowerCase()
return f ? pages.value.filter(p => p.url.toLowerCase().includes(f)) : pages.value
})
const pages = computed(() => {
const map = new Map()
for (const r of allResults.value) {

47
web/src/views/AccessResults.vue
View File

@@ -7,41 +7,48 @@
</div>
<el-table :data="sites" v-loading="loading" stripe size="small" empty-text="暂无访问记录">
<el-table-column prop="siteId" label="站点ID" width="130" />
<el-table-column prop="siteId" label="站点ID" width="110" />
<el-table-column label="站点名称" width="150">
<template #default="scope">
<span class="text-xs">{{ (scope.row.names||[]).join(' / ') || '-' }}</span>
</template>
</el-table-column>
<el-table-column label="版本" width="70">
<template #default="scope">
<el-tag v-if="scope.row.latestVersion" size="small" type="primary">{{ scope.row.latestVersion }}</el-tag>
<span v-else class="text-xs" style="color:#909399">-</span>
</template>
</el-table-column>
<el-table-column label="页面数" width="100">
<template #default="scope">
<el-tag size="small" type="info">{{ scope.row.pages?.length || 0 }}</el-tag>
<span class="text-xs">{{ scope.row.pages?.length || 0 }}页 · {{ scope.row.totalResults || 0 }}次</span>
</template>
</el-table-column>
<el-table-column label="总次数" width="80">
<el-table-column label="解析状态" min-width="140">
<template #default="scope">
<span class="text-xs">{{ scope.row.totalResults }}</span>
</template>
</el-table-column>
<el-table-column label="验证进度" min-width="220">
<template #default="scope">
<div style="display:flex;gap:6px;align-items:center;flex-wrap:wrap">
<el-tag size="small" type="success">{{ scope.row.validCount }} 有效</el-tag>
<el-tag size="small" type="danger">{{ scope.row.invalidCount }} 无效</el-tag>
<el-tag size="small" type="warning">{{ scope.row.uncheckedCount }} 待验</el-tag>
<div style="display:flex;gap:4px;align-items:center">
<el-tag v-if="scope.row.validCount" size="small" type="success">✓{{ scope.row.validCount }}</el-tag>
<el-tag v-if="scope.row.invalidCount" size="small" type="danger">✗{{ scope.row.invalidCount }}</el-tag>
<el-tag v-if="scope.row.uncheckedCount" size="small" type="warning">○{{ scope.row.uncheckedCount }}</el-tag>
<span v-if="!scope.row.validCount && !scope.row.invalidCount && !scope.row.uncheckedCount" class="text-xs" style="color:#909399">未解析</span>
</div>
</template>
</el-table-column>
<el-table-column label="待审核" width="80">
<el-table-column label="待审核" width="70">
<template #default="scope">
<el-tag v-if="scope.row.pendingConfigCount" size="small" type="danger">{{ scope.row.pendingConfigCount }}</el-tag>
<span v-else class="text-xs" style="color:#909399">0</span>
</template>
</el-table-column>
<el-table-column label="最近提交" width="160">
<el-table-column label="最近提交" width="140">
<template #default="scope">
<span class="text-xs">{{ scope.row.lastSubmitted || '-' }}</span>
<span class="text-xs">{{ scope.row.lastSubmitted?.substring(5,16) || '-' }}</span>
</template>
</el-table-column>
<el-table-column label="操作" width="180">
<el-table-column label="操作" width="100">
<template #default="scope">
<el-button size="small" type="primary" @click="$router.push(`/access-results/check/${scope.row.siteId}`)">
进入校验
校验
</el-button>
</template>
</el-table-column>
@@ -59,10 +66,8 @@ const sites = ref([])
const fetchAll = async () => {
loading.value = true
try {
const r = await api.accessResults.summary()
sites.value = r.data || []
} catch { ElMessage.error('获取汇总失败') }
try { sites.value = (await api.accessResults.summary()).data || [] }
catch { ElMessage.error('获取汇总失败') }
finally { loading.value = false }
}