admin/nexus-terminal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update FileManager.vue

Browse Source
This commit is contained in:
Baobhan Sith
2025-04-18 13:08:44 +08:00
parent d2e93b5051
commit 01b44c3562
1 changed files with 41 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/frontend/src/components/FileManager.vue
+41 -31
View File
@@ -763,36 +763,38 @@ const cancelSearch = () => {
/> />
</div> </div>
<!-- 按钮移到 path-bar 外面 --> <!-- 按钮移到 path-bar 外面 -->
<!-- 恢复使用 props.sftpManager.isLoading 和 props.wsDeps.isConnected.value --> <div class="path-actions"> <!-- 新增包裹容器 -->
<button class="toolbar-button" @click.stop="loadDirectory(currentPath)" :disabled="isLoading || !props.wsDeps.isConnected.value || isEditingPath" :title="t('fileManager.actions.refresh')"><i class="fas fa-sync-alt"></i></button> <!-- 恢复使用 props.sftpManager.isLoading 和 props.wsDeps.isConnected.value -->
<!-- 恢复使用 props.sftpManager.isLoading 和 props.wsDeps.isConnected.value --> <button class="toolbar-button" @click.stop="loadDirectory(currentPath)" :disabled="isLoading || !props.wsDeps.isConnected.value || isEditingPath" :title="t('fileManager.actions.refresh')"><i class="fas fa-sync-alt"></i></button>
<button class="toolbar-button" @click.stop="handleItemClick($event, { filename: '..', longname: '..', attrs: { isDirectory: true, isFile: false, isSymbolicLink: false, size: 0, uid: 0, gid: 0, mode: 0, atime: 0, mtime: 0 } })" :disabled="isLoading || !props.wsDeps.isConnected.value || currentPath === '/' || isEditingPath" :title="t('fileManager.actions.parentDirectory')"><i class="fas fa-arrow-up"></i></button> <!-- 恢复使用 props.sftpManager.isLoading 和 props.wsDeps.isConnected.value -->
<!-- 修改后的搜索区域 --> <button class="toolbar-button" @click.stop="handleItemClick($event, { filename: '..', longname: '..', attrs: { isDirectory: true, isFile: false, isSymbolicLink: false, size: 0, uid: 0, gid: 0, mode: 0, atime: 0, mtime: 0 } })" :disabled="isLoading || !props.wsDeps.isConnected.value || currentPath === '/' || isEditingPath" :title="t('fileManager.actions.parentDirectory')"><i class="fas fa-arrow-up"></i></button>
<div class="search-container"> <!-- 修改后的搜索区域 -->
<button <div class="search-container">
v-if="!isSearchActive" <button
class="toolbar-button search-activate-button" v-if="!isSearchActive"
@click.stop="activateSearch" class="toolbar-button search-activate-button"
:disabled="isLoading || !props.wsDeps.isConnected.value" @click.stop="activateSearch"
:title="t('fileManager.searchPlaceholder')" :disabled="isLoading || !props.wsDeps.isConnected.value"
> :title="t('fileManager.searchPlaceholder')"
<i class="fas fa-search"></i> >
</button> <i class="fas fa-search"></i>
<div v-else class="search-bar active"> </button>
<i class="fas fa-search search-icon"></i> <div v-else class="search-bar active">
<input <i class="fas fa-search search-icon"></i>
ref="searchInputRef" <input
type="text" ref="searchInputRef"
v-model="searchQuery" type="text"
:placeholder="t('fileManager.searchPlaceholder')" v-model="searchQuery"
class="search-input" :placeholder="t('fileManager.searchPlaceholder')"
@blur="deactivateSearch" class="search-input"
@keyup.esc="cancelSearch" @blur="deactivateSearch"
/> @keyup.esc="cancelSearch"
<!-- 可选：添加清除按钮 --> />
<!-- <button @click="searchQuery = ''; searchInputRef?.focus()" v-if="searchQuery" class="clear-search-button">&times;</button> --> <!-- 可选：添加清除按钮 -->
</div> <!-- <button @click="searchQuery = ''; searchInputRef?.focus()" v-if="searchQuery" class="clear-search-button">&times;</button> -->
</div> </div>
</div>
</div> <!-- 结束包裹容器 -->
<div class="actions-bar"> <div class="actions-bar">
<input type="file" ref="fileInputRef" @change="handleFileSelected" multiple style="display: none;" /> <input type="file" ref="fileInputRef" @change="handleFileSelected" multiple style="display: none;" />
<!-- 恢复使用 props.sftpManager.isLoading 和 props.wsDeps.isConnected.value --> <!-- 恢复使用 props.sftpManager.isLoading 和 props.wsDeps.isConnected.value -->
@@ -961,7 +963,7 @@ const cancelSearch = () => {
border: 1px solid var(--border-color); /* 添加边框 */ border: 1px solid var(--border-color); /* 添加边框 */
border-radius: 4px; /* 圆角 */ border-radius: 4px; /* 圆角 */
padding: 0.2rem 0.4rem; /* 内边距 */ padding: 0.2rem 0.4rem; /* 内边距 */
flex-grow: 1; /* 占据可用空间 */ /* flex-grow: 1; /* 不再占据可用空间 */
overflow: hidden; /* 防止内部溢出 */ overflow: hidden; /* 防止内部溢出 */
min-width: 100px; /* 最小宽度 */ min-width: 100px; /* 最小宽度 */
} }
@@ -1024,6 +1026,14 @@ const cancelSearch = () => {
color: var(--button-hover-bg-color, var(--button-bg-color)); /* 悬停时使用按钮悬停色 */ color: var(--button-hover-bg-color, var(--button-bg-color)); /* 悬停时使用按钮悬停色 */
} }
/* 新增 path-actions 容器样式 */
.path-actions {
display: flex;
align-items: center;
/* gap: 0.1rem; */ /* 可以根据需要添加微小的间距，但之前已将按钮 margin 设为 0 */
flex-shrink: 0; /* 防止被压缩 */
}
/* Actions Bar美化 */ /* Actions Bar美化 */
.actions-bar { .actions-bar {