fix(overview): 今日更新包数卡片跳转检索页时只显示今日更新

概览卡片点击改为 /search?updatedToday=1,检索页按
北京时间 today 过滤 lastUpdated,工具栏显示「仅今日更新」
标签并支持一键清除。
This commit is contained in:
陈银军
2026-09-21 00:23:02 +08:00
parent 829e1a5d8e
commit 0faaf2d8dc
2 changed files with 33 additions and 2 deletions
+1 -1
View File
@@ -84,7 +84,7 @@ function quickClean() {
<!-- 第二行:辅助指标 5 -->
<div class="stats-2">
<StatMini tone="blue" label="今日更新包数" ico="🆕" :main="String(stats.todayUpdated)" sub="今日有版本更新" link="查看" @link="router.push('/search')" />
<StatMini tone="blue" label="今日更新包数" ico="🆕" :main="String(stats.todayUpdated)" sub="今日有版本更新" link="查看" @link="router.push({ path: '/search', query: { updatedToday: 1 } })" />
<StatMini tone="green" label="缓存版本总数" ico="🧩" :main="stats.totalVersions.toLocaleString()" sub="全部缓存包的版本数" link="查看" @link="router.push('/search')" />
<StatMini tone="orange" label="最大包" ico="🐘" :main="stats.maxPkg?.name || '—'" :unit="stats.maxPkg ? fmtSize(stats.maxPkg.size) : ''" :sub="`${stats.maxPkg?.versions || 0} 个版本`" link="详情" @link="stats.maxPkg && openDrawer(stats.maxPkg)" />
<StatMini tone="purple" label="最老包时间" ico="⏳" :main="stats.oldestPkg?.lastUpdated || '—'" unit="⏰" :sub="stats.oldestPkg ? `${stats.oldestPkg.name} · 未更新` : ''" link="详情" @link="stats.oldestPkg && openDrawer(stats.oldestPkg)" />
+32 -1
View File
@@ -1,6 +1,6 @@
<script setup>
import { ref, computed, watch, onMounted, onUnmounted } from 'vue'
import { useRoute } from 'vue-router'
import { useRoute, useRouter } from 'vue-router'
import PackageDrawer from '../components/PackageDrawer.vue'
import CleanDialog from '../components/CleanDialog.vue'
import StatusTag from '../components/StatusTag.vue'
@@ -9,6 +9,7 @@ import { useStore, fmtSize } from '../store'
const { state, stats, refreshPackages, ignorePkg, unignorePkg, cleanPkg, deleteVersion } = useStore()
const route = useRoute()
const router = useRouter()
const keyword = ref('')
const statusFilter = ref('all') // all | warn | ok | ignored | broken
@@ -16,6 +17,17 @@ const sortMode = ref('default') // default | versions-desc | size-desc | date-de
const isMobile = ref(false)
let debounceTimer = null
// —— 今日更新筛选(从概览「今日更新包数」卡片跳转进入) ——
// 与后端 lastUpdated 同口径:北京时间 YYYY-MM-DD
const todayStr = new Intl.DateTimeFormat('en-CA', {
timeZone: 'Asia/Shanghai', year: 'numeric', month: '2-digit', day: '2-digit',
}).format(new Date())
const todayFilter = ref(false)
function clearTodayFilter() {
todayFilter.value = false
router.replace({ path: '/search' })
}
// —— 响应式 placeholder:移动端精简,桌面端完整 ——
function checkMobile() {
isMobile.value = window.matchMedia('(max-width: 767px)').matches
@@ -78,6 +90,7 @@ onMounted(() => {
if (route.query.status && ['all', 'warn', 'ok', 'ignored', 'broken'].includes(route.query.status)) {
statusFilter.value = route.query.status
}
if (route.query.updatedToday === '1') todayFilter.value = true
})
onUnmounted(() => {
document.removeEventListener('click', closeMenus)
@@ -91,6 +104,7 @@ watch(keyword, () => {
const filtered = computed(() => {
let list = state.packages
if (todayFilter.value) list = list.filter(p => p.lastUpdated === todayStr)
if (statusFilter.value !== 'all') {
list = list.filter(p => p.status === statusFilter.value)
}
@@ -179,6 +193,7 @@ async function onCleanConfirmed(res) {
<div class="tb-count">
共找到 <b>{{ filtered.length }}</b> 个包
<template v-if="keyword">(关键词「{{ keyword }}」)</template>
<template v-if="todayFilter">(<span class="today-chip">仅今日更新 {{ todayStr }} <i @click="clearTodayFilter" title="清除筛选">✕</i></span>)</template>
</div>
<div class="tb-actions">
<div class="dd">
@@ -385,6 +400,22 @@ async function onCleanConfirmed(res) {
white-space: nowrap;
}
.tb-count b { color: var(--orange); }
.today-chip { color: var(--orange); font-weight: 600; }
.today-chip i {
display: inline-grid;
place-items: center;
width: 15px;
height: 15px;
border-radius: 50%;
background: var(--orange-soft);
color: var(--orange);
font-style: normal;
font-size: 9px;
cursor: pointer;
margin-left: 4px;
vertical-align: 1px;
}
.today-chip i:hover { background: var(--orange); color: #fff; }
.tb-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.dd { position: relative; }
.dd-btn {