diff --git a/frontend/src/components/complex-table/index.vue b/frontend/src/components/complex-table/index.vue
index 69628808c..32c26a5f4 100644
--- a/frontend/src/components/complex-table/index.vue
+++ b/frontend/src/components/complex-table/index.vue
@@ -112,6 +112,8 @@ const rightClick = ref({
     currentRow: null,
 });
 const handleRightClick = (row, column, event) => {
+    tableRef.value.refElTable.clearSelection();
+    tableRef.value.refElTable.toggleRowSelection(row);
     if (!props.rightButtons) {
         return;
     }
@@ -126,6 +128,7 @@ const handleRightClick = (row, column, event) => {
 };
 const closeRightClick = () => {
     rightClick.value.visible = false;
+    tableRef.value.refElTable.clearSelection();
     document.removeEventListener('click', closeRightClick);
 };
 const disabled = computed(() => {
@@ -134,6 +137,7 @@ const disabled = computed(() => {
     };
 });
 function rightButtonClick(btn: any) {
+    closeRightClick();
     btn.click(rightClick.value.currentRow);
 }
 
diff --git a/frontend/src/lang/modules/en.ts b/frontend/src/lang/modules/en.ts
index 8801d7b42..9f1eab92b 100644
--- a/frontend/src/lang/modules/en.ts
+++ b/frontend/src/lang/modules/en.ts
@@ -1424,6 +1424,7 @@ const message = {
         downloadStart: 'Download started',
         moveSuccess: 'Successfully moved',
         copySuccess: 'Successfully copied',
+        pasteMsg: 'Please click the [Paste] button at the top right of the target directory',
         move: 'Move',
         calculate: 'Calculate',
         canNotDeCompress: 'Cannot decompress this file',
diff --git a/frontend/src/lang/modules/ja.ts b/frontend/src/lang/modules/ja.ts
index 2430b173b..e82ed4140 100644
--- a/frontend/src/lang/modules/ja.ts
+++ b/frontend/src/lang/modules/ja.ts
@@ -1370,6 +1370,7 @@ const message = {
         downloadStart: 'ダウンロードが始まりました',
         moveSuccess: '正常に移動しました',
         copySuccess: '正常にコピーされました',
+        pasteMsg: '対象ディレクトリの右上にある「貼り付け」ボタンをクリックしてください',
         move: '動く',
         calculate: '計算します',
         canNotDeCompress: 'このファイルを解凍できません',
diff --git a/frontend/src/lang/modules/ko.ts b/frontend/src/lang/modules/ko.ts
index 1ec25e6fd..c1eff225f 100644
--- a/frontend/src/lang/modules/ko.ts
+++ b/frontend/src/lang/modules/ko.ts
@@ -1356,6 +1356,7 @@ const message = {
         downloadStart: '다운로드 시작됨',
         moveSuccess: '이동 성공',
         copySuccess: '복사 성공',
+        pasteMsg: '대상 디렉토리의 오른쪽 상단에 있는 [붙여넣기] 버튼을 클릭하세요',
         move: '이동',
         calculate: '계산',
         canNotDeCompress: '이 파일은 압축 해제할 수 없습니다',
diff --git a/frontend/src/lang/modules/ms.ts b/frontend/src/lang/modules/ms.ts
index 166128868..fc2dcb35f 100644
--- a/frontend/src/lang/modules/ms.ts
+++ b/frontend/src/lang/modules/ms.ts
@@ -1411,6 +1411,7 @@ const message = {
         downloadStart: 'Muat turun bermula',
         moveSuccess: 'Berjaya dipindahkan',
         copySuccess: 'Berjaya disalin',
+        pasteMsg: 'Sila klik butang "Tampal" di bahagian kanan atas direktori sasaran',
         move: 'Pindah',
         calculate: 'Kira',
         canNotDeCompress: 'Tidak dapat nyahmampatkan fail ini',
diff --git a/frontend/src/lang/modules/pt-br.ts b/frontend/src/lang/modules/pt-br.ts
index a13d6cd49..f988b514d 100644
--- a/frontend/src/lang/modules/pt-br.ts
+++ b/frontend/src/lang/modules/pt-br.ts
@@ -1397,6 +1397,7 @@ const message = {
         downloadStart: 'Download iniciado',
         moveSuccess: 'Movido com sucesso',
         copySuccess: 'Copiado com sucesso',
+        pasteMsg: 'Clique no botão "Colar" no canto superior direito do diretório de destino',
         move: 'Mover',
         calculate: 'Calcular',
         canNotDeCompress: 'Não é possível descompactar este arquivo',
diff --git a/frontend/src/lang/modules/ru.ts b/frontend/src/lang/modules/ru.ts
index d40e6cf6a..0358c01ef 100644
--- a/frontend/src/lang/modules/ru.ts
+++ b/frontend/src/lang/modules/ru.ts
@@ -1401,6 +1401,7 @@ const message = {
         downloadStart: 'Загрузка начата',
         moveSuccess: 'Успешно перемещено',
         copySuccess: 'Успешно скопировано',
+        pasteMsg: 'Нажмите кнопку «Вставить» в правом верхнем углу целевой директории',
         move: 'Переместить',
         calculate: 'Вычислить',
         canNotDeCompress: 'Невозможно распаковать этот файл',
diff --git a/frontend/src/lang/modules/tr.ts b/frontend/src/lang/modules/tr.ts
index 3209b8d92..2ac203b75 100644
--- a/frontend/src/lang/modules/tr.ts
+++ b/frontend/src/lang/modules/tr.ts
@@ -1441,6 +1441,7 @@ const message = {
         downloadStart: 'İndirme başladı',
         moveSuccess: 'Başarıyla taşındı',
         copySuccess: 'Başarıyla kopyalandı',
+        pasteMsg: 'Hedef dizinin sağ üst köşesindeki "Yapıştır" düğmesine tıklayın',
         move: 'Taşı',
         calculate: 'Hesapla',
         canNotDeCompress: 'Bu dosyanın sıkıştırması açılamaz',
diff --git a/frontend/src/lang/modules/zh-Hant.ts b/frontend/src/lang/modules/zh-Hant.ts
index 6720b62ed..2b967b5a6 100644
--- a/frontend/src/lang/modules/zh-Hant.ts
+++ b/frontend/src/lang/modules/zh-Hant.ts
@@ -1358,6 +1358,7 @@ const message = {
         downloadStart: '下載開始!',
         moveSuccess: '移動成功',
         copySuccess: '復製成功',
+        pasteMsg: '請在目標目錄點擊右上角【粘貼】按鈕',
         move: '移動',
         calculate: '計算',
         canNotDeCompress: '無法解壓此文件',
diff --git a/frontend/src/lang/modules/zh.ts b/frontend/src/lang/modules/zh.ts
index b8382a1fb..fd87e687d 100644
--- a/frontend/src/lang/modules/zh.ts
+++ b/frontend/src/lang/modules/zh.ts
@@ -1353,6 +1353,7 @@ const message = {
         downloadStart: '下载开始!',
         moveSuccess: '移动成功',
         copySuccess: '复制成功',
+        pasteMsg: '请在目标目录点击右上角【粘贴】按钮',
         move: '移动',
         calculate: '计算',
         canNotDeCompress: '无法解压此文件',
diff --git a/frontend/src/views/host/file-management/index.vue b/frontend/src/views/host/file-management/index.vue
index 2721d84d7..d898cd2b2 100644
--- a/frontend/src/views/host/file-management/index.vue
+++ b/frontend/src/views/host/file-management/index.vue
@@ -1,554 +1,615 @@
 <template>
-    <div @dragover="handleDragover" @drop="handleDrop" @dragleave="handleDragleave">
-        <div class="flex sm:flex-row flex-col justify-start gap-y-2 items-center gap-x-4" ref="toolRef">
-            <div class="flex-shrink-0 flex sm:w-min w-full items-center justify-start">
-                <el-tooltip :content="$t('file.back')" placement="top">
-                    <el-button icon="Back" @click="back" circle />
-                </el-tooltip>
-                <el-tooltip :content="$t('file.right')" placement="top">
-                    <el-button icon="Right" @click="right" circle />
-                </el-tooltip>
-                <el-tooltip :content="$t('file.top')" placement="top">
-                    <el-button icon="Top" @click="top" circle :disabled="paths.length == 0" />
-                </el-tooltip>
-                <el-tooltip :content="$t('commons.button.refresh')" placement="top">
-                    <el-button icon="Refresh" circle @click="search" />
-                </el-tooltip>
-                <el-tooltip :content="req.showHidden ? $t('file.noShowHide') : $t('file.showHide')" placement="top">
-                    <el-button
-                        class="btn"
-                        circle
-                        :type="req.showHidden ? '' : 'primary'"
-                        :icon="req.showHidden ? View : Hide"
-                        @click="viewHideFile"
-                    />
-                </el-tooltip>
-            </div>
-            <div class="flex-1 sm:w-min w-full hidden sm:block" ref="pathRef">
-                <div
-                    v-show="!searchableStatus"
-                    @click="searchableStatus = true"
-                    class="address-bar shadow-md rounded-md px-4 py-2 flex items-center flex-grow"
-                >
-                    <div ref="breadCrumbRef" class="flex items-center address-url">
-                        <span class="root mr-2">
-                            <el-link @click.stop="jump('/')">
-                                <el-icon :size="20"><HomeFilled /></el-icon>
-                            </el-link>
-                        </span>
-                        <span v-for="(path, index) in paths" :key="path.url" class="inline-flex items-center">
-                            <span class="mr-2 arrow">></span>
-                            <template v-if="index === 0 && hidePaths.length > 0">
-                                <el-dropdown>
-                                    <span
-                                        class="path-segment cursor-pointer mr-2 pathname focus:outline-none focus-visible:outline-none"
-                                    >
-                                        ..
-                                    </span>
-                                    <template #dropdown>
-                                        <el-dropdown-menu>
-                                            <el-dropdown-item
-                                                v-for="hidePath in hidePaths"
-                                                :key="hidePath.url"
-                                                @click.stop="jump(hidePath.url)"
-                                            >
-                                                <el-tooltip
-                                                    class="box-item"
-                                                    effect="dark"
-                                                    :content="hidePath.name"
-                                                    placement="bottom"
-                                                >
-                                                    {{
-                                                        hidePath.name.length > 25
-                                                            ? hidePath.name.substring(0, 22) + '...'
-                                                            : hidePath.name
-                                                    }}
-                                                </el-tooltip>
-                                            </el-dropdown-item>
-                                        </el-dropdown-menu>
-                                    </template>
-                                </el-dropdown>
-                                <span class="mr-2 arrow">></span>
-                                <el-tooltip class="box-item" effect="dark" :content="path.name" placement="bottom">
-                                    <el-link
-                                        class="path-segment cursor-pointer mr-2 pathname"
-                                        @click.stop="jump(path.url)"
-                                    >
-                                        {{ path.name.length > 25 ? path.name.substring(0, 22) + '...' : path.name }}
-                                    </el-link>
-                                </el-tooltip>
-                            </template>
-                            <template v-else>
-                                <el-tooltip class="box-item" effect="dark" :content="path.name" placement="bottom">
-                                    <el-link
-                                        class="path-segment cursor-pointer mr-2 pathname"
-                                        @click.stop="jump(path.url)"
-                                    >
-                                        {{ path.name.length > 25 ? path.name.substring(0, 22) + '...' : path.name }}
-                                    </el-link>
-                                </el-tooltip>
-                            </template>
-                        </span>
+    <el-tabs type="card" v-model="editableTabsKey" @tab-change="changeTab" @tab-remove="removeTab">
+        <el-tab-pane
+            closable
+            v-for="item in editableTabs"
+            :key="item.id"
+            :label="item.name == '' ? $t('file.root') : item.name"
+            :name="item.id"
+        >
+            <div @dragover="handleDragover" @drop="handleDrop" @dragleave="handleDragleave">
+                <div class="flex sm:flex-row flex-col justify-start gap-y-2 items-center gap-x-4" ref="toolRef">
+                    <div class="flex-shrink-0 flex sm:w-min w-full items-center justify-start">
+                        <el-tooltip :content="$t('file.back')" placement="top">
+                            <el-button icon="Back" @click="back" circle />
+                        </el-tooltip>
+                        <el-tooltip :content="$t('file.right')" placement="top">
+                            <el-button icon="Right" @click="right" circle />
+                        </el-tooltip>
+                        <el-tooltip :content="$t('file.top')" placement="top">
+                            <el-button icon="Top" @click="top" circle :disabled="paths.length == 0" />
+                        </el-tooltip>
+                        <el-tooltip :content="$t('commons.button.refresh')" placement="top">
+                            <el-button icon="Refresh" circle @click="search" />
+                        </el-tooltip>
+                        <el-tooltip
+                            :content="req.showHidden ? $t('file.noShowHide') : $t('file.showHide')"
+                            placement="top"
+                        >
+                            <el-button
+                                class="btn"
+                                circle
+                                :type="req.showHidden ? '' : 'primary'"
+                                :icon="req.showHidden ? View : Hide"
+                                @click="viewHideFile"
+                            />
+                        </el-tooltip>
                     </div>
-                </div>
-                <el-input
-                    ref="searchableInputRef"
-                    v-show="searchableStatus"
-                    v-model="searchablePath"
-                    @blur="searchableInputBlur"
-                    class="px-4 py-2 border rounded-md shadow-md"
-                    @keyup.enter="
-                        jump(searchablePath);
-                        searchableStatus = false;
-                    "
-                />
-            </div>
-            <div class="flex-1 sm:w-min w-full sm:hidden block">
-                <div class="address-bar shadow-md rounded-md px-4 py-2 flex items-center flex-grow">
-                    <div class="flex items-center address-url">
-                        <span class="root mr-2">
-                            <el-link @click.stop="jump('/')">
-                                <el-icon :size="20"><HomeFilled /></el-icon>
-                            </el-link>
-                        </span>
-                        <span v-for="(path, index) in paths" :key="path.url" class="inline-flex items-center">
-                            <span class="mr-2 arrow">></span>
-                            <template v-if="index === 0 && hidePaths.length > 0">
-                                <el-dropdown>
-                                    <span
-                                        class="path-segment cursor-pointer mr-2 pathname focus:outline-none focus-visible:outline-none"
-                                    >
-                                        ..
-                                    </span>
-                                    <template #dropdown>
-                                        <el-dropdown-menu>
-                                            <el-dropdown-item
-                                                v-for="hidePath in hidePaths"
-                                                :key="hidePath.url"
-                                                @click.stop="jump(hidePath.url)"
-                                            >
-                                                <el-tooltip
-                                                    class="box-item"
-                                                    effect="dark"
-                                                    :content="hidePath.name"
-                                                    placement="bottom"
-                                                >
-                                                    {{
-                                                        hidePath.name.length > 25
-                                                            ? hidePath.name.substring(0, 22) + '...'
-                                                            : hidePath.name
-                                                    }}
-                                                </el-tooltip>
-                                            </el-dropdown-item>
-                                        </el-dropdown-menu>
-                                    </template>
-                                </el-dropdown>
-                                <span class="mr-2 arrow">></span>
-                                <el-tooltip class="box-item" effect="dark" :content="path.name" placement="bottom">
-                                    <el-link
-                                        class="path-segment cursor-pointer mr-2 pathname"
-                                        @click.stop="jump(path.url)"
-                                    >
-                                        {{ path.name.length > 25 ? path.name.substring(0, 22) + '...' : path.name }}
+                    <div class="flex-1 sm:w-min w-full hidden sm:block" :ref="(el) => setPathRef(item.id, el)">
+                        <div
+                            v-show="!searchableStatus"
+                            @click="searchableStatus = true"
+                            class="address-bar shadow-md rounded-md px-4 py-2 flex items-center flex-grow"
+                        >
+                            <div ref="breadCrumbRef" class="flex items-center address-url">
+                                <span class="root mr-2">
+                                    <el-link @click.stop="jump('/')">
+                                        <el-icon :size="20"><HomeFilled /></el-icon>
                                     </el-link>
-                                </el-tooltip>
-                            </template>
-                        </span>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <LayoutContent :title="$t('menu.files')" v-loading="loading">
-            <template #prompt>
-                <el-alert type="info" :closable="false">
-                    <template #title>
-                        <span class="input-help whitespace-break-spaces">
-                            {{ $t('file.fileHelper') }}
-                        </span>
-                    </template>
-                </el-alert>
-            </template>
-            <template #leftToolBar>
-                <div ref="leftWrapper" class="flex items-center gap-2 flex-wrap">
-                    <el-dropdown @command="handleCreate" class="mr-2.5">
-                        <el-button type="primary">
-                            {{ $t('commons.button.create') }}
-                            <el-icon><arrow-down /></el-icon>
-                        </el-button>
-                        <template #dropdown>
-                            <el-dropdown-menu>
-                                <el-dropdown-item command="dir">
-                                    <svg-icon iconName="p-file-folder"></svg-icon>
-                                    {{ $t('file.dir') }}
-                                </el-dropdown-item>
-                                <el-dropdown-item command="file">
-                                    <svg-icon iconName="p-file-normal"></svg-icon>
-                                    {{ $t('menu.files') }}
-                                </el-dropdown-item>
-                            </el-dropdown-menu>
-                        </template>
-                    </el-dropdown>
-                    <el-dropdown class="mr-2.5">
-                        <el-button>
-                            {{ $t('commons.button.upload') }}/{{ $t('commons.button.download') }}
-                            <el-icon><arrow-down /></el-icon>
-                        </el-button>
-                        <template #dropdown>
-                            <el-dropdown-menu>
-                                <el-dropdown-item @click="openUpload">
-                                    <el-icon><ElUpload /></el-icon>
-                                    {{ $t('commons.button.upload') }}
-                                </el-dropdown-item>
-                                <el-dropdown-item @click="openWget">
-                                    <el-icon><ElDownload /></el-icon>
-                                    {{ $t('file.remoteFile') }}
-                                </el-dropdown-item>
-                            </el-dropdown-menu>
-                        </template>
-                    </el-dropdown>
-                    <el-button-group class="sm:!inline-block !flex flex-wrap gap-y-2">
-                        <el-button class="btn" @click="openRecycleBin">
-                            {{ $t('file.recycleBin') }}
-                        </el-button>
-                        <el-button class="btn" @click="toTerminal">
-                            {{ $t('menu.terminal') }}
-                        </el-button>
-                        <el-popover placement="bottom" :width="200" trigger="hover" @before-enter="getFavorites">
-                            <template #reference>
-                                <el-button @click="openFavorite">
-                                    {{ $t('file.favorite') }}
-                                </el-button>
-                            </template>
-                            <div class="favorite-item">
-                                <el-table :data="favorites">
-                                    <el-table-column prop="name">
-                                        <template #default="{ row }">
-                                            <el-tooltip
-                                                class="box-item"
-                                                effect="dark"
-                                                :content="row.path"
-                                                placement="top"
+                                </span>
+                                <span v-for="(path, index) in paths" :key="path.url" class="inline-flex items-center">
+                                    <span class="mr-2 arrow">></span>
+                                    <template v-if="index === 0 && hidePaths.length > 0">
+                                        <el-dropdown>
+                                            <span
+                                                class="path-segment cursor-pointer mr-2 pathname focus:outline-none focus-visible:outline-none"
                                             >
-                                                <span
-                                                    class="table-link text-ellipsis"
-                                                    @click="toFavorite(row)"
-                                                    type="primary"
-                                                >
-                                                    <svg-icon
-                                                        v-if="row.isDir"
-                                                        className="table-icon"
-                                                        iconName="p-file-folder"
-                                                    ></svg-icon>
-                                                    <svg-icon
-                                                        v-else
-                                                        className="table-icon"
-                                                        iconName="p-file-normal"
-                                                    ></svg-icon>
-                                                    {{ row.name }}
-                                                </span>
-                                            </el-tooltip>
-                                        </template>
-                                    </el-table-column>
-                                </el-table>
-                            </div>
-                        </el-popover>
-                        <el-button class="btn" @click="calculateSize(req.path)" :loading="disableBtn">
-                            {{ $t('file.calculate') }}
-                        </el-button>
-                        <template v-if="hostMount.length == 1">
-                            <el-button class="btn" @click.stop="jump(hostMount[0]?.path)">
-                                {{ hostMount[0]?.path }} ({{ $t('file.root') }})
-                                {{ formatFileSize(hostMount[0]?.free) }}
-                            </el-button>
-                        </template>
-                        <template v-else>
-                            <el-dropdown class="mr-2.5">
-                                <el-button class="btn">
-                                    {{ hostMount[0]?.path }} ({{ $t('file.root') }})
-                                    {{ formatFileSize(hostMount[0]?.free) }}
-                                </el-button>
-                                <template #dropdown>
-                                    <el-dropdown-menu>
-                                        <template v-for="(mount, index) in hostMount" :key="mount.path">
-                                            <el-dropdown-item v-if="index == 0" @click.stop="jump(mount.path)">
-                                                {{ mount.path }} ({{ $t('file.root') }})
-                                                {{ formatFileSize(mount.free) }}
-                                            </el-dropdown-item>
-                                            <el-dropdown-item v-if="index != 0" @click.stop="jump(mount.path)">
-                                                {{ mount.path }} ({{ $t('home.mount') }})
-                                                {{ formatFileSize(mount.free) }}
-                                            </el-dropdown-item>
-                                        </template>
-                                    </el-dropdown-menu>
-                                </template>
-                            </el-dropdown>
-                        </template>
-                    </el-button-group>
-
-                    <el-badge :value="processCount" class="btn" v-if="processCount > 0">
-                        <el-button class="btn" @click="openProcess">
-                            {{ $t('file.wgetTask') }}
-                        </el-button>
-                    </el-badge>
-                </div>
-            </template>
-            <template #rightToolBar>
-                <div ref="btnWrapper" class="flex items-center gap-2 flex-wrap">
-                    <div class="flex items-center gap-2 flex-wrap">
-                        <template v-if="visibleButtons.length == 0">
-                            <el-dropdown v-if="moreButtons.length">
-                                <el-button>
-                                    {{ $t('tabs.more') }}
-                                    <i class="el-icon-arrow-down el-icon--right" />
-                                </el-button>
-                                <template #dropdown>
-                                    <el-dropdown-menu>
-                                        <el-dropdown-item
-                                            v-for="btn in moreButtons"
-                                            :key="btn.label"
-                                            @click="btn.action"
-                                            :disabled="selects.length === 0"
+                                                ..
+                                            </span>
+                                            <template #dropdown>
+                                                <el-dropdown-menu>
+                                                    <el-dropdown-item
+                                                        v-for="hidePath in hidePaths"
+                                                        :key="hidePath.url"
+                                                        @click.stop="jump(hidePath.url)"
+                                                    >
+                                                        <el-tooltip
+                                                            class="box-item"
+                                                            effect="dark"
+                                                            :content="hidePath.name"
+                                                            placement="bottom"
+                                                        >
+                                                            {{
+                                                                hidePath.name.length > 25
+                                                                    ? hidePath.name.substring(0, 22) + '...'
+                                                                    : hidePath.name
+                                                            }}
+                                                        </el-tooltip>
+                                                    </el-dropdown-item>
+                                                </el-dropdown-menu>
+                                            </template>
+                                        </el-dropdown>
+                                        <span class="mr-2 arrow">></span>
+                                        <el-tooltip
+                                            class="box-item"
+                                            effect="dark"
+                                            :content="path.name"
+                                            placement="bottom"
                                         >
-                                            {{ $t(btn.label) }}
+                                            <el-link
+                                                class="path-segment cursor-pointer mr-2 pathname"
+                                                @click.stop="jump(path.url)"
+                                            >
+                                                {{
+                                                    path.name.length > 25
+                                                        ? path.name.substring(0, 22) + '...'
+                                                        : path.name
+                                                }}
+                                            </el-link>
+                                        </el-tooltip>
+                                    </template>
+                                    <template v-else>
+                                        <el-tooltip
+                                            class="box-item"
+                                            effect="dark"
+                                            :content="path.name"
+                                            placement="bottom"
+                                        >
+                                            <el-link
+                                                class="path-segment cursor-pointer mr-2 pathname"
+                                                @click.stop="jump(path.url)"
+                                            >
+                                                {{
+                                                    path.name.length > 25
+                                                        ? path.name.substring(0, 22) + '...'
+                                                        : path.name
+                                                }}
+                                            </el-link>
+                                        </el-tooltip>
+                                    </template>
+                                </span>
+                            </div>
+                        </div>
+                        <el-input
+                            ref="searchableInputRef"
+                            v-show="searchableStatus"
+                            v-model="searchablePath"
+                            @blur="searchableInputBlur"
+                            class="px-4 py-2 border rounded-md shadow-md"
+                            @keyup.enter="
+                                jump(searchablePath);
+                                searchableStatus = false;
+                            "
+                        />
+                    </div>
+                    <div class="flex-1 sm:w-min w-full sm:hidden block">
+                        <div class="address-bar shadow-md rounded-md px-4 py-2 flex items-center flex-grow">
+                            <div class="flex items-center address-url">
+                                <span class="root mr-2">
+                                    <el-link @click.stop="jump('/')">
+                                        <el-icon :size="20"><HomeFilled /></el-icon>
+                                    </el-link>
+                                </span>
+                                <span v-for="(path, index) in paths" :key="path.url" class="inline-flex items-center">
+                                    <span class="mr-2 arrow">></span>
+                                    <template v-if="index === 0 && hidePaths.length > 0">
+                                        <el-dropdown>
+                                            <span
+                                                class="path-segment cursor-pointer mr-2 pathname focus:outline-none focus-visible:outline-none"
+                                            >
+                                                ..
+                                            </span>
+                                            <template #dropdown>
+                                                <el-dropdown-menu>
+                                                    <el-dropdown-item
+                                                        v-for="hidePath in hidePaths"
+                                                        :key="hidePath.url"
+                                                        @click.stop="jump(hidePath.url)"
+                                                    >
+                                                        <el-tooltip
+                                                            class="box-item"
+                                                            effect="dark"
+                                                            :content="hidePath.name"
+                                                            placement="bottom"
+                                                        >
+                                                            {{
+                                                                hidePath.name.length > 25
+                                                                    ? hidePath.name.substring(0, 22) + '...'
+                                                                    : hidePath.name
+                                                            }}
+                                                        </el-tooltip>
+                                                    </el-dropdown-item>
+                                                </el-dropdown-menu>
+                                            </template>
+                                        </el-dropdown>
+                                        <span class="mr-2 arrow">></span>
+                                        <el-tooltip
+                                            class="box-item"
+                                            effect="dark"
+                                            :content="path.name"
+                                            placement="bottom"
+                                        >
+                                            <el-link
+                                                class="path-segment cursor-pointer mr-2 pathname"
+                                                @click.stop="jump(path.url)"
+                                            >
+                                                {{
+                                                    path.name.length > 25
+                                                        ? path.name.substring(0, 22) + '...'
+                                                        : path.name
+                                                }}
+                                            </el-link>
+                                        </el-tooltip>
+                                    </template>
+                                </span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <LayoutContent :title="$t('menu.files')" v-loading="loading">
+                    <template #prompt>
+                        <el-alert type="info" :closable="false">
+                            <template #title>
+                                <span class="input-help whitespace-break-spaces">
+                                    {{ $t('file.fileHelper') }}
+                                </span>
+                            </template>
+                        </el-alert>
+                    </template>
+                    <template #leftToolBar>
+                        <div ref="leftWrapper" class="flex items-center gap-2 flex-wrap">
+                            <el-dropdown @command="handleCreate" class="mr-2.5">
+                                <el-button type="primary">
+                                    {{ $t('commons.button.create') }}
+                                    <el-icon><arrow-down /></el-icon>
+                                </el-button>
+                                <template #dropdown>
+                                    <el-dropdown-menu>
+                                        <el-dropdown-item command="dir">
+                                            <svg-icon iconName="p-file-folder"></svg-icon>
+                                            {{ $t('file.dir') }}
+                                        </el-dropdown-item>
+                                        <el-dropdown-item command="file">
+                                            <svg-icon iconName="p-file-normal"></svg-icon>
+                                            {{ $t('menu.files') }}
                                         </el-dropdown-item>
                                     </el-dropdown-menu>
                                 </template>
                             </el-dropdown>
-                        </template>
-                        <template v-if="visibleButtons.length > 0">
-                            <el-button-group class="flex items-center">
-                                <template v-for="btn in visibleButtons" :key="btn.label">
-                                    <el-button plain @click="btn.action" :disabled="selects.length === 0">
-                                        {{ $t(btn.label) }}
+                            <el-dropdown class="mr-2.5">
+                                <el-button>
+                                    {{ $t('commons.button.upload') }}/{{ $t('commons.button.download') }}
+                                    <el-icon><arrow-down /></el-icon>
+                                </el-button>
+                                <template #dropdown>
+                                    <el-dropdown-menu>
+                                        <el-dropdown-item @click="openUpload">
+                                            <el-icon><ElUpload /></el-icon>
+                                            {{ $t('commons.button.upload') }}
+                                        </el-dropdown-item>
+                                        <el-dropdown-item @click="openWget">
+                                            <el-icon><ElDownload /></el-icon>
+                                            {{ $t('file.remoteFile') }}
+                                        </el-dropdown-item>
+                                    </el-dropdown-menu>
+                                </template>
+                            </el-dropdown>
+                            <el-button-group class="sm:!inline-block !flex flex-wrap gap-y-2">
+                                <el-button class="btn" @click="openRecycleBin">
+                                    {{ $t('file.recycleBin') }}
+                                </el-button>
+                                <el-button class="btn" @click="toTerminal">
+                                    {{ $t('menu.terminal') }}
+                                </el-button>
+                                <el-popover
+                                    placement="bottom"
+                                    :width="200"
+                                    trigger="hover"
+                                    @before-enter="getFavorites"
+                                >
+                                    <template #reference>
+                                        <el-button @click="openFavorite">
+                                            {{ $t('file.favorite') }}
+                                        </el-button>
+                                    </template>
+                                    <div class="favorite-item">
+                                        <el-table :data="favorites">
+                                            <el-table-column prop="name">
+                                                <template #default="{ row }">
+                                                    <el-tooltip
+                                                        class="box-item"
+                                                        effect="dark"
+                                                        :content="row.path"
+                                                        placement="top"
+                                                    >
+                                                        <span
+                                                            class="table-link text-ellipsis"
+                                                            @click="toFavorite(row)"
+                                                            type="primary"
+                                                        >
+                                                            <svg-icon
+                                                                v-if="row.isDir"
+                                                                className="table-icon"
+                                                                iconName="p-file-folder"
+                                                            ></svg-icon>
+                                                            <svg-icon
+                                                                v-else
+                                                                className="table-icon"
+                                                                iconName="p-file-normal"
+                                                            ></svg-icon>
+                                                            {{ row.name }}
+                                                        </span>
+                                                    </el-tooltip>
+                                                </template>
+                                            </el-table-column>
+                                        </el-table>
+                                    </div>
+                                </el-popover>
+                                <el-button class="btn" @click="calculateSize(req.path)" :loading="disableBtn">
+                                    {{ $t('file.calculate') }}
+                                </el-button>
+                                <template v-if="hostMount.length == 1">
+                                    <el-button class="btn" @click.stop="jump(hostMount[0]?.path)">
+                                        {{ hostMount[0]?.path }} ({{ $t('file.root') }})
+                                        {{ formatFileSize(hostMount[0]?.free) }}
                                     </el-button>
                                 </template>
-
-                                <el-dropdown v-if="moreButtons.length">
-                                    <el-button>
-                                        {{ $t('tabs.more') }}
-                                        <i class="el-icon-arrow-down el-icon--right" />
-                                    </el-button>
-                                    <template #dropdown>
-                                        <el-dropdown-menu>
-                                            <el-dropdown-item
-                                                v-for="btn in moreButtons"
-                                                :key="btn.label"
-                                                @click="btn.action"
-                                                :disabled="selects.length === 0"
-                                            >
-                                                {{ $t(btn.label) }}
-                                            </el-dropdown-item>
-                                        </el-dropdown-menu>
-                                    </template>
-                                </el-dropdown>
+                                <template v-else>
+                                    <el-dropdown class="mr-2.5">
+                                        <el-button class="btn">
+                                            {{ hostMount[0]?.path }} ({{ $t('file.root') }})
+                                            {{ formatFileSize(hostMount[0]?.free) }}
+                                        </el-button>
+                                        <template #dropdown>
+                                            <el-dropdown-menu>
+                                                <template v-for="(mount, index) in hostMount" :key="mount.path">
+                                                    <el-dropdown-item v-if="index == 0" @click.stop="jump(mount.path)">
+                                                        {{ mount.path }} ({{ $t('file.root') }})
+                                                        {{ formatFileSize(mount.free) }}
+                                                    </el-dropdown-item>
+                                                    <el-dropdown-item v-if="index != 0" @click.stop="jump(mount.path)">
+                                                        {{ mount.path }} ({{ $t('home.mount') }})
+                                                        {{ formatFileSize(mount.free) }}
+                                                    </el-dropdown-item>
+                                                </template>
+                                            </el-dropdown-menu>
+                                        </template>
+                                    </el-dropdown>
+                                </template>
                             </el-button-group>
-                        </template>
-                    </div>
-                    <el-button-group class="copy-button" v-if="moveOpen">
-                        <el-tooltip class="box-item" effect="dark" :content="$t('file.paste')" placement="bottom">
-                            <el-button plain @click="openPaste">{{ $t('file.paste') }}({{ fileMove.count }})</el-button>
-                        </el-tooltip>
-                        <el-tooltip
-                            class="box-item"
-                            effect="dark"
-                            :content="$t('commons.button.cancel')"
-                            placement="bottom"
-                        >
-                            <el-button plain class="close" icon="Close" @click="closeMove"></el-button>
-                        </el-tooltip>
-                    </el-button-group>
-                    <div class="w-80">
-                        <el-input
-                            v-model="req.search"
-                            clearable
-                            @clear="search()"
-                            @keydown.enter="search()"
-                            :placeholder="$t('file.search')"
-                        >
-                            <template #prepend>
-                                <el-checkbox v-model="req.containSub">
-                                    {{ $t('file.sub') }}
-                                </el-checkbox>
-                            </template>
-                            <template #append>
-                                <el-button icon="Search" @click="search" round />
-                            </template>
-                        </el-input>
-                    </div>
-                </div>
-            </template>
-            <template #main>
-                <ComplexTable
-                    :pagination-config="paginationConfig"
-                    v-model:selects="selects"
-                    ref="tableRef"
-                    :data="data"
-                    @search="search"
-                    @sort-change="changeSort"
-                    @cell-mouse-enter="showFavorite"
-                    @cell-mouse-leave="hideFavorite"
-                    :heightDiff="300"
-                    :right-buttons="buttons"
-                >
-                    <el-table-column type="selection" width="30" />
-                    <el-table-column
-                        :label="$t('commons.table.name')"
-                        min-width="250"
-                        fix
-                        show-overflow-tooltip
-                        :sortable="'custom'"
-                        prop="name"
-                    >
-                        <template #default="{ row }">
-                            <div class="file-row">
-                                <div>
-                                    <svg-icon
-                                        v-if="row.isDir"
-                                        className="table-icon"
-                                        iconName="p-file-folder"
-                                    ></svg-icon>
-                                    <svg-icon
-                                        v-else
-                                        className="table-icon"
-                                        :iconName="getIconName(row.extension)"
-                                    ></svg-icon>
-                                </div>
-                                <div class="file-name">
-                                    <el-input
-                                        v-if="fileRename.oldName === row.name && isEdit"
-                                        v-model.trim="fileRename.newName"
-                                        ref="renameInput"
-                                        :autofocus="isEdit"
-                                        class="table-link table-input"
-                                        placeholder="file name"
-                                        @blur="handleSave(row)"
-                                    />
-                                    <span v-else class="table-link" @click="open(row)" type="primary">
-                                        {{ row.name }}
-                                    </span>
-                                    <span v-if="row.isSymlink">-> {{ row.linkPath }}</span>
-                                </div>
-                                <div>
-                                    <el-button
-                                        v-if="row.favoriteID > 0"
-                                        link
-                                        type="warning"
-                                        size="large"
-                                        icon="StarFilled"
-                                        @click="remove(row.favoriteID)"
-                                    ></el-button>
-                                    <div v-else>
-                                        <el-button
-                                            v-if="hoveredRowPath === row.path"
-                                            link
-                                            icon="Star"
-                                            @click="addToFavorite(row)"
-                                        ></el-button>
-                                    </div>
-                                </div>
-                            </div>
-                        </template>
-                    </el-table-column>
-                    <el-table-column :label="$t('file.mode')" prop="mode" min-width="110">
-                        <template #default="{ row }">
-                            <el-link underline="never" @click="openMode(row)">{{ row.mode }}</el-link>
-                        </template>
-                    </el-table-column>
-                    <el-table-column :label="$t('commons.table.user')" prop="user" show-overflow-tooltip min-width="90">
-                        <template #default="{ row }">
-                            <el-link underline="never" @click="openChown(row)">
-                                {{ row.user ? row.user : '-' }} ({{ row.uid }})
-                            </el-link>
-                        </template>
-                    </el-table-column>
-                    <el-table-column :label="$t('file.group')" prop="group" show-overflow-tooltip>
-                        <template #default="{ row }">
-                            <el-link underline="never" @click="openChown(row)">
-                                {{ row.group ? row.group : '-' }} ({{ row.gid }})
-                            </el-link>
-                        </template>
-                    </el-table-column>
-                    <el-table-column :label="$t('file.size')" prop="size" min-width="100" :sortable="'custom'">
-                        <template #default="{ row }">
-                            <el-button
-                                type="primary"
-                                link
-                                small
-                                :loading="row.btnLoading"
-                                @click="row.isDir ? getDirSize(row.path) : getFileSize(row.path)"
-                            >
-                                <span v-if="row.isDir">
-                                    <span v-if="row.dirSize === undefined">
-                                        {{ $t('file.calculate') }}
-                                    </span>
-                                    <span v-else>{{ formatFileSize(row.dirSize) }}</span>
-                                </span>
-                                <span v-else>
-                                    {{ formatFileSize(row.size) }}
-                                </span>
-                            </el-button>
-                        </template>
-                    </el-table-column>
-                    <el-table-column
-                        :label="$t('file.updateTime')"
-                        prop="modTime"
-                        width="180"
-                        :formatter="dateFormat"
-                        show-overflow-tooltip
-                        :sortable="'custom'"
-                    ></el-table-column>
-                    <fu-table-operations
-                        :ellipsis="mobile ? 0 : 2"
-                        :buttons="buttons"
-                        :label="$t('commons.table.operate')"
-                        :min-width="mobile ? 'auto' : 200"
-                        :fixed="mobile ? false : 'right'"
-                        width="270"
-                        fix
-                    />
-                    <template #paginationLeft>
-                        <div class="flex justify-start items-center">
-                            <el-text small>
-                                {{ $t('file.fileDirNum', [dirNum, fileNum]) }}
-                            </el-text>
-                            <el-text small>
-                                {{ $t('file.currentDir') + $t('file.size') + ' ' }}
-                            </el-text>
-                            <el-button type="primary" link small :loading="calculateBtn">
-                                <span v-if="dirTotalSize == -1" @click="getDirTotalSize(req.path)">
-                                    {{ $t('file.calculate') }}
-                                </span>
-                                <span v-else>
-                                    {{ formatFileSize(dirTotalSize) }}
-                                </span>
-                            </el-button>
+
+                            <el-badge :value="processCount" class="btn" v-if="processCount > 0">
+                                <el-button class="btn" @click="openProcess">
+                                    {{ $t('file.wgetTask') }}
+                                </el-button>
+                            </el-badge>
                         </div>
                     </template>
-                </ComplexTable>
-            </template>
+                    <template #rightToolBar>
+                        <div :ref="(el) => setBtnWrapperRef(item.id, el)" class="flex items-center gap-2 flex-wrap">
+                            <div class="flex items-center gap-2 flex-wrap">
+                                <template v-if="visibleButtons.length == 0">
+                                    <el-dropdown v-if="moreButtons.length">
+                                        <el-button>
+                                            {{ $t('tabs.more') }}
+                                            <i class="el-icon-arrow-down el-icon--right" />
+                                        </el-button>
+                                        <template #dropdown>
+                                            <el-dropdown-menu>
+                                                <el-dropdown-item
+                                                    v-for="btn in moreButtons"
+                                                    :key="btn.label"
+                                                    @click="btn.action"
+                                                    :disabled="selects.length === 0"
+                                                >
+                                                    {{ $t(btn.label) }}
+                                                </el-dropdown-item>
+                                            </el-dropdown-menu>
+                                        </template>
+                                    </el-dropdown>
+                                </template>
+                                <template v-if="visibleButtons.length > 0">
+                                    <el-button-group class="flex items-center">
+                                        <template v-for="btn in visibleButtons" :key="btn.label">
+                                            <el-button plain @click="btn.action" :disabled="selects.length === 0">
+                                                {{ $t(btn.label) }}
+                                            </el-button>
+                                        </template>
 
-            <CreateFile ref="createRef" @close="search" />
-            <ChangeRole ref="roleRef" @close="search" />
-            <Compress ref="compressRef" @close="search" />
-            <Decompress ref="deCompressRef" @close="search" />
-            <CodeEditor ref="codeEditorRef" @close="search" />
-            <FileRename ref="renameRef" @close="search" />
-            <Upload ref="uploadRef" @close="search" />
-            <Wget ref="wgetRef" @close="closeWget" />
-            <Move ref="moveRef" @close="closeMovePage" />
-            <Download ref="downloadRef" @close="search" />
-            <Process ref="processRef" @close="closeProcess" />
-            <Owner ref="chownRef" @close="search"></Owner>
-            <Detail ref="detailRef" />
-            <DeleteFile ref="deleteRef" @close="search" />
-            <RecycleBin ref="recycleBinRef" @close="search" />
-            <Favorite ref="favoriteRef" @close="search" />
-            <BatchRole ref="batchRoleRef" @close="search" />
-            <VscodeOpenDialog ref="dialogVscodeOpenRef" />
-            <Preview ref="previewRef" />
-            <TerminalDialog ref="dialogTerminalRef" />
-        </LayoutContent>
-    </div>
+                                        <el-dropdown v-if="moreButtons.length">
+                                            <el-button>
+                                                {{ $t('tabs.more') }}
+                                                <i class="el-icon-arrow-down el-icon--right" />
+                                            </el-button>
+                                            <template #dropdown>
+                                                <el-dropdown-menu>
+                                                    <el-dropdown-item
+                                                        v-for="btn in moreButtons"
+                                                        :key="btn.label"
+                                                        @click="btn.action"
+                                                        :disabled="selects.length === 0"
+                                                    >
+                                                        {{ $t(btn.label) }}
+                                                    </el-dropdown-item>
+                                                </el-dropdown-menu>
+                                            </template>
+                                        </el-dropdown>
+                                    </el-button-group>
+                                </template>
+                            </div>
+                            <el-button-group class="copy-button" v-if="moveOpen">
+                                <el-tooltip
+                                    class="box-item"
+                                    effect="dark"
+                                    :content="$t('file.paste')"
+                                    placement="bottom"
+                                >
+                                    <el-button plain @click="openPaste">
+                                        {{ $t('file.paste') }}({{ fileMove.count }})
+                                    </el-button>
+                                </el-tooltip>
+                                <el-tooltip
+                                    class="box-item"
+                                    effect="dark"
+                                    :content="$t('commons.button.cancel')"
+                                    placement="bottom"
+                                >
+                                    <el-button plain class="close" icon="Close" @click="closeMove"></el-button>
+                                </el-tooltip>
+                            </el-button-group>
+                            <div class="w-80">
+                                <el-input
+                                    v-model="req.search"
+                                    clearable
+                                    @clear="search()"
+                                    @keydown.enter="search()"
+                                    :placeholder="$t('file.search')"
+                                >
+                                    <template #prepend>
+                                        <el-checkbox v-model="req.containSub">
+                                            {{ $t('file.sub') }}
+                                        </el-checkbox>
+                                    </template>
+                                    <template #append>
+                                        <el-button icon="Search" @click="search" round />
+                                    </template>
+                                </el-input>
+                            </div>
+                        </div>
+                    </template>
+                    <template #main>
+                        <ComplexTable
+                            :pagination-config="paginationConfig"
+                            v-model:selects="selects"
+                            :ref="(el) => setTableRef(item.id, el)"
+                            :data="data"
+                            @search="search"
+                            @sort-change="changeSort"
+                            @cell-mouse-enter="showFavorite"
+                            @cell-mouse-leave="hideFavorite"
+                            :heightDiff="340"
+                            :right-buttons="buttons"
+                        >
+                            <el-table-column type="selection" width="30" />
+                            <el-table-column
+                                :label="$t('commons.table.name')"
+                                min-width="250"
+                                fix
+                                show-overflow-tooltip
+                                :sortable="'custom'"
+                                prop="name"
+                            >
+                                <template #default="{ row }">
+                                    <div class="file-row">
+                                        <div>
+                                            <svg-icon
+                                                v-if="row.isDir"
+                                                className="table-icon"
+                                                iconName="p-file-folder"
+                                            ></svg-icon>
+                                            <svg-icon
+                                                v-else
+                                                className="table-icon"
+                                                :iconName="getIconName(row.extension)"
+                                            ></svg-icon>
+                                        </div>
+                                        <div class="file-name">
+                                            <el-input
+                                                v-if="fileRename.oldName === row.name && isEdit"
+                                                v-model.trim="fileRename.newName"
+                                                :ref="(el) => setRenameRef(item.id, el)"
+                                                :autofocus="isEdit"
+                                                class="table-link table-input"
+                                                placeholder="file name"
+                                                @blur="handleRename(row)"
+                                            />
+                                            <span v-else class="table-link" @click="open(row)" type="primary">
+                                                {{ row.name }}
+                                            </span>
+                                            <span v-if="row.isSymlink">-> {{ row.linkPath }}</span>
+                                        </div>
+                                        <div>
+                                            <el-button
+                                                v-if="row.favoriteID > 0"
+                                                link
+                                                type="warning"
+                                                size="large"
+                                                icon="StarFilled"
+                                                @click="remove(row.favoriteID)"
+                                            ></el-button>
+                                            <div v-else>
+                                                <el-button
+                                                    v-if="hoveredRowPath === row.path"
+                                                    link
+                                                    icon="Star"
+                                                    @click="addToFavorite(row)"
+                                                ></el-button>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </template>
+                            </el-table-column>
+                            <el-table-column :label="$t('file.mode')" prop="mode" min-width="110">
+                                <template #default="{ row }">
+                                    <el-link underline="never" @click="openMode(row)">{{ row.mode }}</el-link>
+                                </template>
+                            </el-table-column>
+                            <el-table-column
+                                :label="$t('commons.table.user')"
+                                prop="user"
+                                show-overflow-tooltip
+                                min-width="90"
+                            >
+                                <template #default="{ row }">
+                                    <el-link underline="never" @click="openChown(row)">
+                                        {{ row.user ? row.user : '-' }} ({{ row.uid }})
+                                    </el-link>
+                                </template>
+                            </el-table-column>
+                            <el-table-column :label="$t('file.group')" prop="group" show-overflow-tooltip>
+                                <template #default="{ row }">
+                                    <el-link underline="never" @click="openChown(row)">
+                                        {{ row.group ? row.group : '-' }} ({{ row.gid }})
+                                    </el-link>
+                                </template>
+                            </el-table-column>
+                            <el-table-column :label="$t('file.size')" prop="size" min-width="100" :sortable="'custom'">
+                                <template #default="{ row }">
+                                    <el-button
+                                        type="primary"
+                                        link
+                                        small
+                                        :loading="row.btnLoading"
+                                        @click="row.isDir ? getDirSize(row.path) : getFileSize(row.path)"
+                                    >
+                                        <span v-if="row.isDir">
+                                            <span v-if="row.dirSize === undefined">
+                                                {{ $t('file.calculate') }}
+                                            </span>
+                                            <span v-else>{{ formatFileSize(row.dirSize) }}</span>
+                                        </span>
+                                        <span v-else>
+                                            {{ formatFileSize(row.size) }}
+                                        </span>
+                                    </el-button>
+                                </template>
+                            </el-table-column>
+                            <el-table-column
+                                :label="$t('file.updateTime')"
+                                prop="modTime"
+                                width="180"
+                                :formatter="dateFormat"
+                                show-overflow-tooltip
+                                :sortable="'custom'"
+                            ></el-table-column>
+                            <fu-table-operations
+                                :ellipsis="mobile ? 0 : 2"
+                                :buttons="buttons"
+                                :label="$t('commons.table.operate')"
+                                :min-width="mobile ? 'auto' : 200"
+                                :fixed="mobile ? false : 'right'"
+                                width="270"
+                                fix
+                            />
+                            <template #paginationLeft>
+                                <div class="flex justify-start items-center">
+                                    <el-text small>
+                                        {{ $t('file.fileDirNum', [dirNum, fileNum]) }}
+                                    </el-text>
+                                    <el-text small>
+                                        {{ $t('file.currentDir') + $t('file.size') + ' ' }}
+                                    </el-text>
+                                    <el-button type="primary" link small :loading="calculateBtn">
+                                        <span v-if="dirTotalSize == -1" @click="getDirTotalSize(req.path)">
+                                            {{ $t('file.calculate') }}
+                                        </span>
+                                        <span v-else>
+                                            {{ formatFileSize(dirTotalSize) }}
+                                        </span>
+                                    </el-button>
+                                </div>
+                            </template>
+                        </ComplexTable>
+                    </template>
+                </LayoutContent>
+            </div>
+        </el-tab-pane>
+        <el-tab-pane :closable="false">
+            <template #label>
+                <el-icon @click="addTab()"><Plus /></el-icon>
+            </template>
+        </el-tab-pane>
+        <CreateFile ref="createRef" @close="search" />
+        <ChangeRole ref="roleRef" @close="search" />
+        <Compress ref="compressRef" @close="search" />
+        <Decompress ref="deCompressRef" @close="search" />
+        <CodeEditor ref="codeEditorRef" @close="search" />
+        <FileRename ref="renameRef" @close="search" />
+        <Upload ref="uploadRef" @close="search" />
+        <Wget ref="wgetRef" @close="closeWget" />
+        <Move ref="moveRef" @close="closeMovePage" />
+        <Download ref="downloadRef" @close="search" />
+        <Process ref="processRef" @close="closeProcess" />
+        <Owner ref="chownRef" @close="search"></Owner>
+        <Detail ref="detailRef" />
+        <DeleteFile ref="deleteRef" @close="search" />
+        <RecycleBin ref="recycleBinRef" @close="search" />
+        <Favorite ref="favoriteRef" @close="search" />
+        <BatchRole ref="batchRoleRef" @close="search" />
+        <VscodeOpenDialog ref="dialogVscodeOpenRef" />
+        <Preview ref="previewRef" />
+        <TerminalDialog ref="dialogTerminalRef" />
+    </el-tabs>
 </template>
 
 <script setup lang="ts">
@@ -599,6 +660,7 @@ import { debounce } from 'lodash-es';
 import TerminalDialog from './terminal/index.vue';
 import { Dashboard } from '@/api/interface/dashboard';
 import { CompressExtension, MimetypeByExtensionObject } from '@/enums/files';
+import type { TabPaneName } from 'element-plus';
 
 const globalStore = GlobalStore();
 
@@ -609,10 +671,17 @@ interface FilePaths {
 
 const router = useRouter();
 const data = ref();
-const tableRef = ref();
+const tableRefs = ref<Record<string, any>>({});
+
+const setTableRef = (key: string, el: any) => {
+    if (el) {
+        tableRefs.value[key] = el;
+    }
+};
+const getCurrentTable = () => tableRefs.value[editableTabsKey.value];
+
 let selects = ref<any>([]);
 
-// origin data
 const initData = () => ({
     path: '/',
     expand: true,
@@ -654,7 +723,6 @@ const uploadRef = ref();
 const wgetRef = ref();
 const moveRef = ref();
 const downloadRef = ref();
-const pathRef = ref();
 const toolRef = ref();
 const breadCrumbRef = ref();
 const chownRef = ref();
@@ -677,7 +745,24 @@ const dirNum = ref(0);
 const fileNum = ref(0);
 const imageFiles = ref([]);
 const isEdit = ref(false);
-const renameInput = ref(null);
+
+const renameRefs = ref<Record<string, any>>({});
+
+const setRenameRef = (key: string, el: any) => {
+    if (el) {
+        renameRefs.value[key] = el;
+    }
+};
+const getCurrentRename = () => renameRefs.value[editableTabsKey.value];
+
+const pathRefs = ref<Record<string, any>>({});
+
+const setPathRef = (key: string, el: any) => {
+    if (el) {
+        pathRefs.value[key] = el;
+    }
+};
+const getCurrentPath = () => pathRefs.value[editableTabsKey.value];
 
 const { searchableStatus, searchablePath, searchableInputRef, searchableInputBlur } = useSearchable(paths);
 
@@ -694,14 +779,13 @@ const mobile = computed(() => {
 
 const search = async () => {
     dirTotalSize.value = -1;
-    getWgetProcess();
+    await getWgetProcess();
     loading.value = true;
     if (req.search != '') {
         req.sortBy = 'name';
         req.sortOrder = 'ascending';
-        tableRef.value.clearSort();
+        getCurrentTable().clearSort();
     }
-
     req.page = paginationConfig.currentPage;
     req.pageSize = paginationConfig.pageSize;
     await getFilesList(req)
@@ -757,7 +841,7 @@ const open = async (row: File.File) => {
             url: req.path,
             name: name,
         });
-        jump(req.path);
+        await jump(req.path);
     } else {
         openView(row);
     }
@@ -769,8 +853,16 @@ const copyDir = (row: File.File) => {
     }
 };
 
-const btnWrapper = ref<HTMLElement | null>(null);
 const leftWrapper = ref<HTMLElement | null>(null);
+const btnWrapperRefs = ref<Record<string, any>>({});
+
+const setBtnWrapperRef = (key: string, el: any) => {
+    if (el) {
+        btnWrapperRefs.value[key] = el;
+    }
+};
+const getCurrentBtnWrapper = () => btnWrapperRefs.value[editableTabsKey.value];
+
 const toolButtons = ref([
     {
         label: 'commons.button.copy',
@@ -799,7 +891,7 @@ const moreButtons = ref([]);
 
 const updateButtons = async () => {
     await nextTick();
-    if (!btnWrapper.value) return;
+    if (!getCurrentBtnWrapper()) return;
     const pathWidth = toolRef.value.offsetWidth;
     const leftWidth = leftWrapper.value.offsetWidth;
     let num = Math.floor((pathWidth - leftWidth - 450) / 100);
@@ -834,13 +926,13 @@ const btnResizeHandler = debounce(() => {
 }, 100);
 
 const observeResize = () => {
-    const el = pathRef.value as any;
+    const el = getCurrentPath() as any;
     if (!el) return;
     resizeObserver = new ResizeObserver(() => {
         resizeHandler();
     });
 
-    const ele = btnWrapper.value as any;
+    const ele = getCurrentBtnWrapper() as any;
     if (!ele) return;
     resizeObserver = new ResizeObserver(() => {
         btnResizeHandler();
@@ -899,7 +991,8 @@ const jump = async (url: string) => {
     globalStore.setLastFilePath(req.path);
     handleSearchResult(searchResult);
     getPaths(req.path);
-    nextTick(function () {
+    updateTab(req.path);
+    await nextTick(function () {
         handlePath();
     });
 };
@@ -914,7 +1007,8 @@ const backForwardJump = async (url: string) => {
     let searchResult = await searchFile();
     handleSearchResult(searchResult);
     getPaths(req.path);
-    nextTick(function () {
+    updateTab(req.path);
+    await nextTick(function () {
         handlePath();
     });
 };
@@ -1182,11 +1276,12 @@ const openRename = (item: File.File) => {
     fileRename.newName = item.name;
     isEdit.value = true;
     nextTick(() => {
-        renameInput.value?.focus();
+        getCurrentRename().focus();
     });
+    hideRightMenu();
 };
 
-const handleSave = async (row: File.File): Promise<void> => {
+const handleRename = async (row: File.File): Promise<void> => {
     if (fileRename.newName === fileRename.oldName) {
         isEdit.value = false;
         fileRename.oldName = '';
@@ -1201,6 +1296,7 @@ const handleSave = async (row: File.File): Promise<void> => {
         await renameRile(addItem);
         MsgSuccess(i18n.global.t('commons.msg.updateSuccess'));
         row.name = fileRename.newName;
+        row.path = getPath(req.path, fileRename.newName);
     } catch (error) {
         console.error(error);
     } finally {
@@ -1236,6 +1332,11 @@ const openMove = (type: string) => {
         fileMove.allNames = allNames;
     }
     moveOpen.value = true;
+    if (type === 'cut') {
+        MsgSuccess(i18n.global.t('file.moveSuccess') + '! ' + i18n.global.t('file.pasteMsg'));
+    } else {
+        MsgSuccess(i18n.global.t('file.copySuccess') + '! ' + i18n.global.t('file.pasteMsg'));
+    }
 };
 
 const openMoveBtn = (type: string, item: File.File) => {
@@ -1246,7 +1347,7 @@ const openMoveBtn = (type: string, item: File.File) => {
 
 const closeMove = () => {
     selects.value = [];
-    tableRef.value.clearSelects();
+    getCurrentTable().clearSelects();
     hideRightMenu();
     fileMove.oldPaths = [];
     fileMove.name = '';
@@ -1260,13 +1361,6 @@ const openPaste = () => {
     moveRef.value.acceptParams(fileMove);
 };
 
-const openPasteBtn = (file: File.File) => {
-    if (file.isDir) {
-        fileMove.path = file.path;
-    }
-    moveRef.value.acceptParams(fileMove);
-};
-
 const openDownload = (file: File.File) => {
     downloadFile(file.path, globalStore.currentNode);
 };
@@ -1371,9 +1465,7 @@ const buttons = [
     },
     {
         label: i18n.global.t('file.paste'),
-        click: (row: File.File) => {
-            openPasteBtn(row);
-        },
+        click: openPaste,
         disabled: () => {
             return !moveOpen.value;
         },
@@ -1475,7 +1567,7 @@ const handleDragleave = (event: { preventDefault: () => void }) => {
 };
 
 function hideRightMenu() {
-    tableRef.value.closeRightClick();
+    getCurrentTable().closeRightClick();
 }
 
 onMounted(() => {
@@ -1492,7 +1584,18 @@ onMounted(() => {
         req.path = globalStore.lastFilePath;
         getPaths(req.path);
     }
-    pathWidth.value = pathRef.value.offsetWidth;
+    pathWidth.value = getCurrentPath().offsetWidth;
+    paths.value = [];
+
+    const segments = editableTabsValue.value.split('/').filter(Boolean);
+    let url = '';
+    segments.forEach((segment) => {
+        url += '/' + segment;
+        paths.value.push({
+            url,
+            name: segment,
+        });
+    });
     search();
     history.push(req.path);
     pointer = history.length - 1;
@@ -1502,6 +1605,115 @@ onMounted(() => {
     });
 });
 
+const editableTabsKey = ref('');
+const editableTabsValue = ref('');
+const editableTabsName = ref('');
+const editableTabs = ref([
+    { id: '1', name: 'opt', path: '/opt' },
+    { id: '2', name: 'home', path: '/home' },
+]);
+
+function initTabs() {
+    const savedTabs = localStorage.getItem('editableTabs');
+    if (savedTabs) {
+        editableTabs.value = JSON.parse(savedTabs);
+    }
+
+    const savedTabsKey = localStorage.getItem('editableTabsKey');
+    if (savedTabsKey) {
+        editableTabsKey.value = savedTabsKey;
+        const tab = editableTabs.value.find((t) => t.id === savedTabsKey);
+        if (tab) {
+            editableTabsValue.value = tab.path;
+            editableTabsName.value = tab.name;
+        } else {
+            setFirstTab();
+        }
+    } else {
+        setFirstTab();
+    }
+}
+
+function setFirstTab() {
+    if (editableTabs.value.length > 0) {
+        const first = editableTabs.value[0];
+        editableTabsKey.value = first.id;
+        editableTabsValue.value = first.path;
+        editableTabsName.value = first.name;
+    }
+}
+
+initTabs();
+
+watch(
+    [editableTabs, editableTabsKey],
+    ([newTabs, newKey]) => {
+        localStorage.setItem('editableTabs', JSON.stringify(newTabs));
+        localStorage.setItem('editableTabsKey', newKey);
+    },
+    { deep: true },
+);
+
+function getLastPath(path: string): string {
+    if (!path) return '';
+    const parts = path.split('/').filter(Boolean);
+    return parts.length ? parts[parts.length - 1] : '';
+}
+
+function updateTab(newPath?: string) {
+    const tab = editableTabs.value.find((t) => t.id === editableTabsKey.value);
+    if (tab) {
+        tab.path = newPath;
+        tab.name = getLastPath(newPath);
+    }
+}
+
+const addTab = () => {
+    let tabIndex = editableTabs.value.length;
+    const newTabId = `${++tabIndex}`;
+    editableTabs.value.push({
+        id: newTabId,
+        name: 'opt',
+        path: '/opt',
+    });
+    editableTabsKey.value = newTabId;
+    changeTab(newTabId);
+};
+
+const changeTab = (targetPath: TabPaneName) => {
+    editableTabsKey.value = targetPath.toString();
+    const current = editableTabs.value.find((tab) => tab.id === editableTabsKey.value);
+    editableTabsName.value = current ? current.name : '';
+    editableTabsValue.value = current ? current.path : '';
+    req.path = editableTabsValue.value;
+    paths.value = [];
+    paths.value.push({
+        url: editableTabsValue.value,
+        name: editableTabsName.value,
+    });
+    search();
+};
+
+const removeTab = (targetPath: TabPaneName) => {
+    editableTabsKey.value = targetPath.toString();
+    const tabs = editableTabs.value;
+    let activeKey = editableTabsKey.value;
+    if (activeKey === targetPath) {
+        tabs.forEach((tab, index) => {
+            if (tab.name === targetPath) {
+                const nextTab = tabs[index + 1] || tabs[index - 1];
+                if (nextTab) {
+                    activeKey = nextTab.id;
+                }
+            }
+        });
+    }
+
+    editableTabsKey.value = activeKey;
+    editableTabs.value = tabs.filter((tab) => tab.id !== activeKey);
+    changeTab((Number(activeKey) - 1).toString());
+};
+
 onBeforeUnmount(() => {
     if (resizeObserver) resizeObserver.disconnect();
 });