陈银军
a7dc1b7a17
后端 fmtMb 用 toFixed(1) 保留 1 位小数，<0.05MB 的包（几 KB~几十 KB 的轻量组件）被截断为 0。改为保留 KB 级精度；前端统一使用 store 的 fmtSize/fmtBytes（新增 KB 档位），所有包大小显示点（检索/忽略/概览/ 卡片/抽屉/清理对话框/Top20）统一替换，消除各组件重复的本地格式化。
70 lines
2.4 KiB
Vue
70 lines
2.4 KiB
Vue
<script setup>
|
||
import { computed } from 'vue'
|
||
import { useStore, fmtSize } from '../store'
|
||
|
||
const { state, unignorePkg, refreshPackages } = useStore()
|
||
|
||
const ignoredList = computed(() => state.packages.filter(p => p.status === 'ignored'))
|
||
|
||
async function doUnignore(pkg) {
|
||
try {
|
||
await ElMessageBox.confirm(`确定将 ${pkg.name} 移出忽略吗？移出后若仍超阈值将恢复预警。`, '移出忽略', {
|
||
confirmButtonText: '移出',
|
||
cancelButtonText: '取消',
|
||
type: 'warning',
|
||
})
|
||
} catch {
|
||
return
|
||
}
|
||
await unignorePkg(pkg.name)
|
||
ElMessage.success(`已移出忽略：${pkg.name}`)
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<div class="page-inner">
|
||
<div class="page-title"><span class="emo">🚫</span>已忽略的包</div>
|
||
<div class="page-sub">共 <b>{{ ignoredList.length }}</b> 个已忽略包 · 移出后自动恢复状态判断</div>
|
||
|
||
<div v-if="state.loading" class="loading-tip">⏳ 加载中…</div>
|
||
<div v-else class="vtable">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>包名</th>
|
||
<th style="width: 140px">版本数</th>
|
||
<th style="width: 150px">占用空间</th>
|
||
<th style="width: 170px">忽略时间</th>
|
||
<th style="width: 130px">操作</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr v-for="p in ignoredList" :key="p.name">
|
||
<td><span class="pkg-cell">{{ p.name }}</span></td>
|
||
<td><span class="num-cell">{{ p.versions }}</span></td>
|
||
<td><span class="num-cell">{{ fmtSize(p.size) }}</span></td>
|
||
<td><span class="ign-time">{{ p.ignoredAt || '—' }}</span></td>
|
||
<td>
|
||
<button class="btn unignore" @click="doUnignore(p)">↩️ 移出忽略</button>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<div v-if="!ignoredList.length" class="empty-tip">
|
||
🎉 还没有忽略任何包
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<style scoped>
|
||
.pkg-cell { font-weight: 600; word-break: break-all; }
|
||
.ign-time { font-family: var(--num); font-size: 12.5px; color: var(--ink-dim); }
|
||
.empty-tip { padding: 60px 0; text-align: center; color: var(--ink-faint); font-size: 13px; }
|
||
.loading-tip { text-align: center; padding: 40px 0; color: var(--ink-faint); font-size: 13px; }
|
||
@media (max-width: 767px) {
|
||
.vtable { overflow-x: auto; }
|
||
.vtable table { min-width: 600px; }
|
||
}
|
||
</style>
|