Update FileManager.vue

This commit is contained in:
Baobhan Sith
2025-04-30 14:08:41 +08:00
parent 71c00819c6
commit 21f82a1df7
@@ -1150,36 +1150,10 @@ defineExpose({ focusSearchInput, startPathEdit });
<template>
<div class="flex flex-col h-full overflow-hidden bg-background text-foreground text-sm font-sans">
<div class="flex items-center justify-between flex-wrap gap-2 p-2 bg-header flex-shrink-0">
<!-- Path Bar -->
<div class="flex items-center bg-background border border-border rounded px-1.5 py-0.5 overflow-hidden min-w-[100px] flex-shrink">
<span v-show="!isEditingPath" class="text-text-secondary whitespace-nowrap overflow-x-auto pr-2">
{{ t('fileManager.currentPath') }}:
<strong
@click="startPathEdit"
:title="t('fileManager.editPathTooltip')"
class="font-medium text-link ml-1 px-1 rounded cursor-text transition-colors duration-200"
:class="{
'hover:bg-black/5': currentSftpManager && props.wsDeps.isConnected.value,
'opacity-60 cursor-not-allowed': !currentSftpManager || !props.wsDeps.isConnected.value
}"
>
{{ currentSftpManager?.currentPath?.value ?? '/' }}
</strong>
</span>
<input
v-show="isEditingPath"
ref="pathInputRef"
type="text"
v-model="editablePath"
class="flex-grow bg-transparent text-foreground p-0.5 outline-none min-w-[100px]"
data-focus-id="fileManagerPathInput"
@keyup.enter="handlePathInput"
@blur="handlePathInput"
@keyup.esc="cancelPathEdit"
/>
</div>
<!-- Wrapper for Path Actions and Path Bar -->
<div class="flex items-center gap-2 flex-shrink"> <!-- Added gap-2 -->
<!-- Path Actions -->
<div class="flex items-center flex-shrink-0 mr-auto">
<div class="flex items-center flex-shrink-0"> <!-- Removed mr-auto -->
<!-- 新增CD 到终端按钮 -->
<button
class="flex items-center justify-center w-7 h-7 text-text-secondary rounded transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed hover:enabled:bg-black/10 hover:enabled:text-foreground"
@@ -1237,6 +1211,35 @@ defineExpose({ focusSearchInput, startPathEdit });
</div>
</div>
</div> <!-- End Path Actions -->
<!-- Path Bar -->
<div class="flex items-center bg-background border border-border rounded px-1.5 py-0.5 overflow-hidden min-w-[100px] flex-shrink">
<span v-show="!isEditingPath" class="text-text-secondary whitespace-nowrap overflow-x-auto pr-2">
{{ t('fileManager.currentPath') }}:
<strong
@click="startPathEdit"
:title="t('fileManager.editPathTooltip')"
class="font-medium text-link ml-1 px-1 rounded cursor-text transition-colors duration-200"
:class="{
'hover:bg-black/5': currentSftpManager && props.wsDeps.isConnected.value,
'opacity-60 cursor-not-allowed': !currentSftpManager || !props.wsDeps.isConnected.value
}"
>
{{ currentSftpManager?.currentPath?.value ?? '/' }}
</strong>
</span>
<input
v-show="isEditingPath"
ref="pathInputRef"
type="text"
v-model="editablePath"
class="flex-grow bg-transparent text-foreground p-0.5 outline-none min-w-[100px]"
data-focus-id="fileManagerPathInput"
@keyup.enter="handlePathInput"
@blur="handlePathInput"
@keyup.esc="cancelPathEdit"
/>
</div>
</div> <!-- End Wrapper -->
<!-- Main Actions Bar -->
<div class="flex items-center gap-2 flex-shrink-0">
<input type="file" ref="fileInputRef" @change="handleFileSelected" multiple class="hidden" />