update
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, computed, onMounted, onBeforeUnmount, nextTick, watch, watchEffect, type PropType, readonly, defineExpose, shallowRef } from 'vue';
|
import { ref, computed, onMounted, onBeforeUnmount, nextTick, watch, watchEffect, type PropType, readonly, defineExpose, shallowRef, toRef } from 'vue';
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
import { useRoute } from 'vue-router';
|
import { useRoute } from 'vue-router';
|
||||||
import { storeToRefs } from 'pinia';
|
import { storeToRefs } from 'pinia';
|
||||||
@@ -44,6 +44,10 @@ const props = defineProps({
|
|||||||
type: Object as PropType<WebSocketDependencies>,
|
type: Object as PropType<WebSocketDependencies>,
|
||||||
required: true,
|
required: true,
|
||||||
},
|
},
|
||||||
|
isMobile: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
// --- 核心 Composables ---
|
// --- 核心 Composables ---
|
||||||
@@ -651,6 +655,7 @@ const {
|
|||||||
isConnected: props.wsDeps.isConnected,
|
isConnected: props.wsDeps.isConnected,
|
||||||
isSftpReady: props.wsDeps.isSftpReady,
|
isSftpReady: props.wsDeps.isSftpReady,
|
||||||
clipboardState: readonly(clipboardState), // +++ 传递剪贴板状态 (只读) +++
|
clipboardState: readonly(clipboardState), // +++ 传递剪贴板状态 (只读) +++
|
||||||
|
isMobile: toRef(props, 'isMobile'), // +++ 传递 isMobile prop 作为 ref +++
|
||||||
t,
|
t,
|
||||||
// --- 传递回调函数 ---
|
// --- 传递回调函数 ---
|
||||||
// 修改:确保在调用前检查 currentSftpManager.value
|
// 修改:确保在调用前检查 currentSftpManager.value
|
||||||
@@ -1322,7 +1327,7 @@ const handleOpenEditorClick = () => {
|
|||||||
<!-- Path Bar -->
|
<!-- 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">
|
<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">
|
<span v-show="!isEditingPath" class="text-text-secondary whitespace-nowrap overflow-x-auto pr-2">
|
||||||
{{ t('fileManager.currentPath') }}:
|
<span v-if="!props.isMobile">{{ t('fileManager.currentPath') }}:</span>
|
||||||
<strong
|
<strong
|
||||||
@click="startPathEdit"
|
@click="startPathEdit"
|
||||||
:title="t('fileManager.editPathTooltip')"
|
:title="t('fileManager.editPathTooltip')"
|
||||||
@@ -1358,9 +1363,10 @@ const handleOpenEditorClick = () => {
|
|||||||
:disabled="!currentSftpManager || !props.wsDeps.isConnected.value"
|
:disabled="!currentSftpManager || !props.wsDeps.isConnected.value"
|
||||||
:title="t('fileManager.actions.openEditor', 'Open Popup Editor')"
|
:title="t('fileManager.actions.openEditor', 'Open Popup Editor')"
|
||||||
class="flex items-center gap-1 px-2.5 py-1 bg-background border border-border rounded text-foreground text-xs transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed hover:enabled:bg-header hover:enabled:border-primary hover:enabled:text-primary"
|
class="flex items-center gap-1 px-2.5 py-1 bg-background border border-border rounded text-foreground text-xs transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed hover:enabled:bg-header hover:enabled:border-primary hover:enabled:text-primary"
|
||||||
|
:class="{ 'px-1.5': props.isMobile }"
|
||||||
>
|
>
|
||||||
<i class="far fa-edit text-sm"></i> <!-- 使用编辑图标 -->
|
<i class="far fa-edit text-sm"></i> <!-- 使用编辑图标 -->
|
||||||
<span>{{ t('fileManager.actions.openEditor', 'Open Editor') }}</span> <!-- 添加 i18n key -->
|
<span v-if="!props.isMobile">{{ t('fileManager.actions.openEditor', 'Open Editor') }}</span> <!-- 添加 i18n key -->
|
||||||
</button>
|
</button>
|
||||||
<!-- 上传按钮 -->
|
<!-- 上传按钮 -->
|
||||||
<button
|
<button
|
||||||
@@ -1368,27 +1374,30 @@ const handleOpenEditorClick = () => {
|
|||||||
:disabled="!currentSftpManager || !props.wsDeps.isConnected.value"
|
:disabled="!currentSftpManager || !props.wsDeps.isConnected.value"
|
||||||
:title="t('fileManager.actions.uploadFile')"
|
:title="t('fileManager.actions.uploadFile')"
|
||||||
class="flex items-center gap-1 px-2.5 py-1 bg-background border border-border rounded text-foreground text-xs transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed hover:enabled:bg-header hover:enabled:border-primary hover:enabled:text-primary"
|
class="flex items-center gap-1 px-2.5 py-1 bg-background border border-border rounded text-foreground text-xs transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed hover:enabled:bg-header hover:enabled:border-primary hover:enabled:text-primary"
|
||||||
|
:class="{ 'px-1.5': props.isMobile }"
|
||||||
>
|
>
|
||||||
<i class="fas fa-upload text-sm"></i>
|
<i class="fas fa-upload text-sm"></i>
|
||||||
<span>{{ t('fileManager.actions.upload') }}</span>
|
<span v-if="!props.isMobile">{{ t('fileManager.actions.upload') }}</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
@click="handleNewFolderContextMenuClick"
|
@click="handleNewFolderContextMenuClick"
|
||||||
:disabled="!currentSftpManager || !props.wsDeps.isConnected.value"
|
:disabled="!currentSftpManager || !props.wsDeps.isConnected.value"
|
||||||
:title="t('fileManager.actions.newFolder')"
|
:title="t('fileManager.actions.newFolder')"
|
||||||
class="flex items-center gap-1 px-2.5 py-1 bg-background border border-border rounded text-foreground text-xs transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed hover:enabled:bg-header hover:enabled:border-primary hover:enabled:text-primary"
|
class="flex items-center gap-1 px-2.5 py-1 bg-background border border-border rounded text-foreground text-xs transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed hover:enabled:bg-header hover:enabled:border-primary hover:enabled:text-primary"
|
||||||
|
:class="{ 'px-1.5': props.isMobile }"
|
||||||
>
|
>
|
||||||
<i class="fas fa-folder-plus text-sm"></i>
|
<i class="fas fa-folder-plus text-sm"></i>
|
||||||
<span>{{ t('fileManager.actions.newFolder') }}</span>
|
<span v-if="!props.isMobile">{{ t('fileManager.actions.newFolder') }}</span>
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
@click="handleNewFileContextMenuClick"
|
@click="handleNewFileContextMenuClick"
|
||||||
:disabled="!currentSftpManager || !props.wsDeps.isConnected.value"
|
:disabled="!currentSftpManager || !props.wsDeps.isConnected.value"
|
||||||
:title="t('fileManager.actions.newFile')"
|
:title="t('fileManager.actions.newFile')"
|
||||||
class="flex items-center gap-1 px-2.5 py-1 bg-background border border-border rounded text-foreground text-xs transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed hover:enabled:bg-header hover:enabled:border-primary hover:enabled:text-primary"
|
class="flex items-center gap-1 px-2.5 py-1 bg-background border border-border rounded text-foreground text-xs transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed hover:enabled:bg-header hover:enabled:border-primary hover:enabled:text-primary"
|
||||||
|
:class="{ 'px-1.5': props.isMobile }"
|
||||||
>
|
>
|
||||||
<i class="far fa-file-alt text-sm"></i>
|
<i class="far fa-file-alt text-sm"></i>
|
||||||
<span>{{ t('fileManager.actions.newFile') }}</span>
|
<span v-if="!props.isMobile">{{ t('fileManager.actions.newFile') }}</span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -807,13 +807,14 @@ const closeFileManagerModal = () => {
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex-grow overflow-hidden">
|
<div class="flex-grow overflow-hidden">
|
||||||
<template v-for="props in fileManagerPropsMap.values()" :key="props.sessionId">
|
<template v-for="propsData in fileManagerPropsMap.values()" :key="`${propsData.sessionId}-${isMobile}`">
|
||||||
<div v-show="props.sessionId === currentFileManagerSessionId" class="h-full">
|
<div v-show="propsData.sessionId === currentFileManagerSessionId" class="h-full">
|
||||||
<FileManager
|
<FileManager
|
||||||
:session-id="props.sessionId"
|
:session-id="propsData.sessionId"
|
||||||
:instance-id="props.instanceId"
|
:instance-id="propsData.instanceId"
|
||||||
:db-connection-id="props.dbConnectionId"
|
:db-connection-id="propsData.dbConnectionId"
|
||||||
:ws-deps="props.wsDeps"
|
:ws-deps="propsData.wsDeps"
|
||||||
|
:is-mobile="isMobile"
|
||||||
class="h-full"
|
class="h-full"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user