update at 2026-02-07 14:47:38
This commit is contained in:
@@ -36,6 +36,17 @@ const isAllPreviewSelected = computed(() => {
|
|||||||
return previewIds.every(id => selectedIds.has(id))
|
return previewIds.every(id => selectedIds.has(id))
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const isAllFavoriteSelected = computed(() => {
|
||||||
|
const favoriteIds = fontStore.favoriteFonts.map(font => font.id)
|
||||||
|
if (favoriteIds.length === 0) {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
return favoriteIds.every(id => fontStore.previewFontIds.has(id))
|
||||||
|
})
|
||||||
|
|
||||||
|
const favoriteFontCount = computed(() => fontStore.favoriteFonts.length)
|
||||||
|
|
||||||
// 加载字体列表
|
// 加载字体列表
|
||||||
try {
|
try {
|
||||||
useFontLoader()
|
useFontLoader()
|
||||||
@@ -186,6 +197,20 @@ function handleTogglePreviewSelectAll() {
|
|||||||
svgPreviewRef.value?.toggleSelectAllPreviewItems()
|
svgPreviewRef.value?.toggleSelectAllPreviewItems()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function handleToggleFavoriteSelectAll() {
|
||||||
|
const favoriteIds = fontStore.favoriteFonts.map(font => font.id)
|
||||||
|
if (favoriteIds.length === 0) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
if (isAllFavoriteSelected.value) {
|
||||||
|
favoriteIds.forEach(id => fontStore.removeFromPreview(id))
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
favoriteIds.forEach(id => fontStore.addToPreview(id))
|
||||||
|
}
|
||||||
|
|
||||||
console.log('App.vue: script setup completed')
|
console.log('App.vue: script setup completed')
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -304,7 +329,22 @@ console.log('App.vue: script setup completed')
|
|||||||
|
|
||||||
<!-- Frame 5: 已收藏字体 - 弹性高度 -->
|
<!-- Frame 5: 已收藏字体 - 弹性高度 -->
|
||||||
<div class="border border-solid border-[#f7e0e0] rounded-lg p-1.5 flex flex-col gap-2 flex-1 overflow-hidden min-h-[120px]">
|
<div class="border border-solid border-[#f7e0e0] rounded-lg p-1.5 flex flex-col gap-2 flex-1 overflow-hidden min-h-[120px]">
|
||||||
<h2 class="text-base text-black shrink-0 leading-none">已收藏字体</h2>
|
<div class="flex items-center pr-[9px]">
|
||||||
|
<h2 class="text-base text-black shrink-0 leading-none flex-1">
|
||||||
|
已收藏字体({{ favoriteFontCount }}字体)
|
||||||
|
</h2>
|
||||||
|
<button
|
||||||
|
@click="handleToggleFavoriteSelectAll"
|
||||||
|
class="w-4 h-4 shrink-0 p-0 border-0 bg-transparent cursor-pointer hover:opacity-85 transition-opacity"
|
||||||
|
title="已收藏字体全选/全不选"
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
:src="isAllFavoriteSelected ? unselectAllIcon : selectAllIcon"
|
||||||
|
alt="已收藏字体全选/全不选"
|
||||||
|
class="w-full h-full"
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
<div v-overflow-aware class="scrollbar-hover flex-1 overflow-y-auto overflow-x-hidden pr-2">
|
<div v-overflow-aware class="scrollbar-hover flex-1 overflow-y-auto overflow-x-hidden pr-2">
|
||||||
<FavoritesList />
|
<FavoritesList />
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -48,6 +48,10 @@ function getCategoryFontIds(node: FontTreeNode): string[] {
|
|||||||
.map(child => child.fontInfo.id)
|
.map(child => child.fontInfo.id)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function getCategoryFontCount(node: FontTreeNode): number {
|
||||||
|
return getCategoryFontIds(node).length
|
||||||
|
}
|
||||||
|
|
||||||
function isCategoryAllInPreview(node: FontTreeNode): boolean {
|
function isCategoryAllInPreview(node: FontTreeNode): boolean {
|
||||||
const ids = getCategoryFontIds(node)
|
const ids = getCategoryFontIds(node)
|
||||||
return ids.length > 0 && ids.every(id => fontStore.previewFontIds.has(id))
|
return ids.length > 0 && ids.every(id => fontStore.previewFontIds.has(id))
|
||||||
@@ -101,7 +105,7 @@ function handleCategorySelectAll(node: FontTreeNode, event: Event) {
|
|||||||
@click="toggleExpand(node)"
|
@click="toggleExpand(node)"
|
||||||
class="text-base font-medium text-black cursor-pointer flex-1 ml-2"
|
class="text-base font-medium text-black cursor-pointer flex-1 ml-2"
|
||||||
>
|
>
|
||||||
{{ node.name }}
|
{{ node.name }}({{ getCategoryFontCount(node) }}字体)
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="flex items-center gap-2 shrink-0 mr-[1px]">
|
<div class="flex items-center gap-2 shrink-0 mr-[1px]">
|
||||||
|
|||||||
Reference in New Issue
Block a user