This commit is contained in:
Baobhan Sith
2025-04-27 09:38:24 +08:00
parent 48e4002b1a
commit bef2dd620b
2 changed files with 10 additions and 10 deletions
@@ -37,19 +37,19 @@
v-for="(entry, index) in filteredHistory" v-for="(entry, index) in filteredHistory"
:key="entry.id" :key="entry.id"
class="group flex justify-between items-center px-3 py-2.5 mb-1 cursor-pointer rounded-md hover:bg-primary/10 transition-colors duration-150" class="group flex justify-between items-center px-3 py-2.5 mb-1 cursor-pointer rounded-md hover:bg-primary/10 transition-colors duration-150"
:class="{ 'bg-primary/20 text-white font-medium': index === storeSelectedIndex }" :class="{ 'bg-primary/20 font-medium': index === storeSelectedIndex }"
@click="executeCommand(entry.command)" @click="executeCommand(entry.command)"
> >
<!-- Command Text --> <!-- Command Text -->
<span class="truncate mr-2 flex-grow font-mono text-sm" :class="{'text-white': index === storeSelectedIndex, 'text-foreground': index !== storeSelectedIndex}">{{ entry.command }}</span> <span class="truncate mr-2 flex-grow font-mono text-sm text-foreground">{{ entry.command }}</span>
<!-- Actions (Show on Hover) --> <!-- Actions (Show on Hover) -->
<div class="flex items-center flex-shrink-0 opacity-0 group-hover:opacity-100 focus-within:opacity-100 transition-opacity duration-150"> <div class="flex items-center flex-shrink-0 opacity-0 group-hover:opacity-100 focus-within:opacity-100 transition-opacity duration-150">
<!-- Copy Button --> <!-- Copy Button -->
<button @click.stop="copyCommand(entry.command)" class="p-1.5 rounded hover:bg-black/10 transition-colors duration-150" :class="{'text-white hover:bg-white/20': index === storeSelectedIndex, 'text-text-secondary hover:text-primary': index !== storeSelectedIndex}" :title="$t('commandHistory.copy', '复制')"> <button @click.stop="copyCommand(entry.command)" class="p-1.5 rounded hover:bg-black/10 transition-colors duration-150 text-text-secondary hover:text-primary" :title="$t('commandHistory.copy', '复制')">
<i class="fas fa-copy text-sm"></i> <i class="fas fa-copy text-sm"></i>
</button> </button>
<!-- Delete Button --> <!-- Delete Button -->
<button @click.stop="deleteSingleCommand(entry.id)" class="ml-1 p-1.5 rounded hover:bg-black/10 transition-colors duration-150" :class="{'text-white hover:bg-white/20': index === storeSelectedIndex, 'text-text-secondary hover:text-error': index !== storeSelectedIndex}" :title="$t('commandHistory.delete', '删除')"> <button @click.stop="deleteSingleCommand(entry.id)" class="ml-1 p-1.5 rounded hover:bg-black/10 transition-colors duration-150 text-text-secondary hover:text-error" :title="$t('commandHistory.delete', '删除')">
<i class="fas fa-times text-sm"></i> <i class="fas fa-times text-sm"></i>
</button> </button>
</div> </div>
@@ -45,24 +45,24 @@
v-for="(cmd, index) in filteredAndSortedCommands" v-for="(cmd, index) in filteredAndSortedCommands"
:key="cmd.id" :key="cmd.id"
class="group flex justify-between items-center px-3 py-2.5 mb-1 cursor-pointer rounded-md hover:bg-primary/10 transition-colors duration-150" class="group flex justify-between items-center px-3 py-2.5 mb-1 cursor-pointer rounded-md hover:bg-primary/10 transition-colors duration-150"
:class="{ 'bg-primary/20 text-white font-medium': index === storeSelectedIndex }" :class="{ 'bg-primary/20 font-medium': index === storeSelectedIndex }"
@click="executeCommand(cmd)" @click="executeCommand(cmd)"
> >
<!-- Command Info --> <!-- Command Info -->
<div class="flex flex-col overflow-hidden mr-2 flex-grow"> <div class="flex flex-col overflow-hidden mr-2 flex-grow">
<span v-if="cmd.name" class="font-medium text-sm truncate mb-0.5" :class="{'text-white': index === storeSelectedIndex, 'text-foreground': index !== storeSelectedIndex}">{{ cmd.name }}</span> <span v-if="cmd.name" class="font-medium text-sm truncate mb-0.5 text-foreground">{{ cmd.name }}</span>
<span class="text-xs truncate font-mono" :class="{ 'text-sm': !cmd.name, 'text-white/80': index === storeSelectedIndex, 'text-text-secondary': index !== storeSelectedIndex }">{{ cmd.command }}</span> <span class="text-xs truncate font-mono" :class="{ 'text-sm': !cmd.name, 'text-text-secondary': true }">{{ cmd.command }}</span>
</div> </div>
<!-- Actions (Show on Hover) --> <!-- Actions (Show on Hover) -->
<div class="flex items-center flex-shrink-0 opacity-0 group-hover:opacity-100 focus-within:opacity-100 transition-opacity duration-150"> <div class="flex items-center flex-shrink-0 opacity-0 group-hover:opacity-100 focus-within:opacity-100 transition-opacity duration-150">
<!-- Usage Count --> <!-- Usage Count -->
<span class="text-xs bg-border px-1.5 py-0.5 rounded mr-2" :class="{'text-white/80 bg-white/20': index === storeSelectedIndex, 'text-text-secondary': index !== storeSelectedIndex}" :title="t('quickCommands.usageCount', '使用次数')">{{ cmd.usage_count }}</span> <span class="text-xs bg-border px-1.5 py-0.5 rounded mr-2 text-text-secondary" :title="t('quickCommands.usageCount', '使用次数')">{{ cmd.usage_count }}</span>
<!-- Edit Button --> <!-- Edit Button -->
<button @click.stop="openEditForm(cmd)" class="p-1.5 rounded hover:bg-black/10 transition-colors duration-150" :class="{'text-white hover:bg-white/20': index === storeSelectedIndex, 'text-text-secondary hover:text-primary': index !== storeSelectedIndex}" :title="$t('common.edit', '编辑')"> <button @click.stop="openEditForm(cmd)" class="p-1.5 rounded hover:bg-black/10 transition-colors duration-150 text-text-secondary hover:text-primary" :title="$t('common.edit', '编辑')">
<i class="fas fa-edit text-sm"></i> <i class="fas fa-edit text-sm"></i>
</button> </button>
<!-- Delete Button --> <!-- Delete Button -->
<button @click.stop="confirmDelete(cmd)" class="p-1.5 rounded hover:bg-black/10 transition-colors duration-150" :class="{'text-white hover:bg-white/20': index === storeSelectedIndex, 'text-text-secondary hover:text-error': index !== storeSelectedIndex}" :title="$t('common.delete', '删除')"> <button @click.stop="confirmDelete(cmd)" class="p-1.5 rounded hover:bg-black/10 transition-colors duration-150 text-text-secondary hover:text-error" :title="$t('common.delete', '删除')">
<i class="fas fa-times text-sm"></i> <i class="fas fa-times text-sm"></i>
</button> </button>
</div> </div>