修复翻译按钮不显示的问题

This commit is contained in:
2025-12-01 14:54:39 +08:00
parent 261c9fbf0f
commit 5c4798cdc9
3 changed files with 31 additions and 27 deletions
-1
View File
@@ -1120,7 +1120,6 @@ function isRemoveDisabled(token: string): boolean {
<div class="pe-title-group"> <div class="pe-title-group">
<span>提示词映射双击修改</span> <span>提示词映射双击修改</span>
<button <button
v-if="unmappedTokens.length > 0"
class="pe-auto-trans-btn" class="pe-auto-trans-btn"
@click="() => { translationTargetToken = null; showTranslationPopup = true; }" @click="() => { translationTargetToken = null; showTranslationPopup = true; }"
title="自动翻译未映射词条" title="自动翻译未映射词条"
+15 -24
View File
@@ -35,28 +35,21 @@ function displayTrans(tag: PromptTag) {
<div class="pqa-root"> <div class="pqa-root">
<!-- Categories --> <!-- Categories -->
<div class="pqa-categories"> <div class="pqa-categories">
<button <button v-for="(c, i) in categories" :key="c.id" class="pqa-tab"
v-for="(c, i) in categories" :class="{ active: i === store.selectedCategoryIndex }" @click="selectCategory(i)">
:key="c.id"
class="pqa-tab"
:class="{ active: i === store.selectedCategoryIndex }"
@click="selectCategory(i)"
>
{{ c.name }} {{ c.name }}
</button> </button>
</div> </div>
<!-- Groups --> <!-- Groups -->
<div class="pqa-groups" v-if="currentCategory?.groups.length"> <div class="pqa-groups" v-if="currentCategory?.groups.length">
<button <button v-for="(g, i) in currentCategory.groups" :key="g.id" class="pqa-group-tab"
v-for="(g, i) in currentCategory.groups" :class="{ active: i === store.selectedGroupIndex }" :style="{
:key="g.id" '--group-color':
class="pqa-group-tab" g.color && g.color !== 'rgba(0, 0, 0, .0)'
:class="{ active: i === store.selectedGroupIndex }" ? g.color
:style="{ '--group-color': g.color || 'var(--color-text-secondary)' }" : 'var(--color-text-secondary)'
@click="selectGroup(i)" }" @click="selectGroup(i)" @mousedown.prevent>
@mousedown.prevent
>
<span class="pqa-dot"></span> <span class="pqa-dot"></span>
{{ g.name }} {{ g.name }}
</button> </button>
@@ -64,14 +57,8 @@ function displayTrans(tag: PromptTag) {
<!-- Tags --> <!-- Tags -->
<div class="pqa-tags"> <div class="pqa-tags">
<button <button v-for="tag in filteredTags" :key="tag.key" class="pqa-tag" @click="onTagClick(tag)" @mousedown.prevent
v-for="tag in filteredTags" :title="tag.key">
:key="tag.key"
class="pqa-tag"
@click="onTagClick(tag)"
@mousedown.prevent
:title="tag.key"
>
<span class="pqa-tag-text">{{ displayTrans(tag) }}</span> <span class="pqa-tag-text">{{ displayTrans(tag) }}</span>
<span class="pqa-tag-sub" v-if="displayTrans(tag) !== tag.key">{{ tag.key }}</span> <span class="pqa-tag-sub" v-if="displayTrans(tag) !== tag.key">{{ tag.key }}</span>
</button> </button>
@@ -106,10 +93,12 @@ function displayTrans(tag: PromptTag) {
.pqa-categories::-webkit-scrollbar { .pqa-categories::-webkit-scrollbar {
height: 8px; height: 8px;
} }
.pqa-categories::-webkit-scrollbar-thumb { .pqa-categories::-webkit-scrollbar-thumb {
background: var(--color-border); background: var(--color-border);
border-radius: 4px; border-radius: 4px;
} }
.pqa-categories::-webkit-scrollbar-thumb:hover { .pqa-categories::-webkit-scrollbar-thumb:hover {
background: var(--color-text-tertiary); background: var(--color-text-tertiary);
} }
@@ -148,10 +137,12 @@ function displayTrans(tag: PromptTag) {
.pqa-groups::-webkit-scrollbar { .pqa-groups::-webkit-scrollbar {
height: 8px; height: 8px;
} }
.pqa-groups::-webkit-scrollbar-thumb { .pqa-groups::-webkit-scrollbar-thumb {
background: var(--color-border); background: var(--color-border);
border-radius: 4px; border-radius: 4px;
} }
.pqa-groups::-webkit-scrollbar-thumb:hover { .pqa-groups::-webkit-scrollbar-thumb:hover {
background: var(--color-text-tertiary); background: var(--color-text-tertiary);
} }
+16 -2
View File
@@ -17,7 +17,7 @@
{{ tokens.length }} 个未映射词条 {{ tokens.length }} 个未映射词条
</div> </div>
<div class="tp-actions"> <div class="tp-actions">
<button @click="startTranslation" :disabled="loading" class="tp-btn primary"> <button @click="startTranslation" :disabled="loading || tokens.length === 0" class="tp-btn primary">
{{ loading ? '翻译中...' : '开始翻译' }} {{ loading ? '翻译中...' : '开始翻译' }}
</button> </button>
</div> </div>
@@ -26,13 +26,17 @@
<div class="tp-list"> <div class="tp-list">
<div class="tp-list-header"> <div class="tp-list-header">
<label class="tp-checkbox-wrapper"> <label class="tp-checkbox-wrapper">
<input type="checkbox" :checked="isAllSelected" @change="toggleSelectAll" /> <input type="checkbox" :checked="isAllSelected" @change="toggleSelectAll" :disabled="tokens.length === 0" />
<span>全选</span> <span>全选</span>
</label> </label>
<span>原词</span> <span>原词</span>
<span>翻译结果 (可直接编辑)</span> <span>翻译结果 (可直接编辑)</span>
</div> </div>
<div v-if="tokens.length === 0" class="tp-empty-state">
暂无未映射词条
</div>
<div v-for="token in tokens" :key="token" class="tp-item" :class="{ selected: selected.has(token) }"> <div v-for="token in tokens" :key="token" class="tp-item" :class="{ selected: selected.has(token) }">
<label class="tp-checkbox-wrapper"> <label class="tp-checkbox-wrapper">
<input <input
@@ -333,6 +337,16 @@ function apply() {
flex-direction: column; flex-direction: column;
} }
.tp-empty-state {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
color: var(--color-text-tertiary);
font-size: 0.875rem;
padding: 2rem;
}
/* Scrollbar styling */ /* Scrollbar styling */
.tp-list::-webkit-scrollbar { .tp-list::-webkit-scrollbar {
width: 8px; width: 8px;