feat(search): 检索页包列表加包 logo

复用 PkgLogo 组件(GitHub 组织头像 / 站点 favicon / 首字母降级),
包名单元格改为 logo + 包名横向排列。
This commit is contained in:
陈银军
2026-09-19 22:00:15 +08:00
parent a0f0c27c44
commit 1793888900
+7 -1
View File
@@ -4,6 +4,7 @@ import { useRoute } from 'vue-router'
import PackageDrawer from '../components/PackageDrawer.vue' import PackageDrawer from '../components/PackageDrawer.vue'
import CleanDialog from '../components/CleanDialog.vue' import CleanDialog from '../components/CleanDialog.vue'
import StatusTag from '../components/StatusTag.vue' import StatusTag from '../components/StatusTag.vue'
import PkgLogo from '../components/PkgLogo.vue'
import { useStore } from '../store' import { useStore } from '../store'
const { state, stats, refreshPackages, ignorePkg, unignorePkg, cleanPkg, deleteVersion } = useStore() const { state, stats, refreshPackages, ignorePkg, unignorePkg, cleanPkg, deleteVersion } = useStore()
@@ -131,7 +132,10 @@ async function onCleanConfirmed(res) {
<tbody> <tbody>
<tr v-for="p in filtered" :key="p.name" @click="openDrawer(p)"> <tr v-for="p in filtered" :key="p.name" @click="openDrawer(p)">
<td> <td>
<span class="pkg-cell">{{ p.name }}</span> <span class="pkg-name">
<PkgLogo :name="p.name" :size="30" :homepage="p.homepage" />
<span class="pkg-cell">{{ p.name }}</span>
</span>
</td> </td>
<td><span class="num-cell" :class="{ over: p.versions > state.threshold.versionThreshold }">{{ p.versions }}</span></td> <td><span class="num-cell" :class="{ over: p.versions > state.threshold.versionThreshold }">{{ p.versions }}</span></td>
<td><span class="num-cell">{{ p.size }} MB</span></td> <td><span class="num-cell">{{ p.size }} MB</span></td>
@@ -268,6 +272,8 @@ async function onCleanConfirmed(res) {
font-weight: 600; font-weight: 600;
} }
.result-note b { color: var(--orange); } .result-note b { color: var(--orange); }
.pkg-name { display: inline-flex; align-items: center; gap: 9px; min-width: 0; }
.pkg-name .pkg-cell { min-width: 0; }
.pkg-cell { font-weight: 600; word-break: break-all; } .pkg-cell { font-weight: 600; word-break: break-all; }
.num-cell.over { color: var(--red); } .num-cell.over { color: var(--red); }
/* 操作列:按钮横排一行,不换行 */ /* 操作列:按钮横排一行,不换行 */