From 0f191398db69ff6c39ea2b0ae08a1a87f6c02c54 Mon Sep 17 00:00:00 2001
From: chaos-zhu <ggchaos1022@gmail.com>
Date: Sat, 31 Aug 2024 15:39:19 +0800
Subject: [PATCH] =?UTF-8?q?:sparkles:=20SFTP=E6=94=AF=E6=8C=81=E8=BE=93?=
 =?UTF-8?q?=E5=85=A5=E8=B7=AF=E5=BE=84=E8=B7=B3=E8=BD=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/package.json                           |  2 +-
 web/src/views/terminal/components/sftp.vue | 39 +++++++++++++++++++++-
 2 files changed, 39 insertions(+), 2 deletions(-)

diff --git a/web/package.json b/web/package.json
index ab3eff0..c756b09 100644
--- a/web/package.json
+++ b/web/package.json
@@ -1,6 +1,6 @@
 {
   "name": "web",
-  "version": "2.2.3",
+  "version": "2.2.4",
   "description": "easynode-web",
   "private": true,
   "scripts": {
diff --git a/web/src/views/terminal/components/sftp.vue b/web/src/views/terminal/components/sftp.vue
index 2f2f791..798f8bc 100644
--- a/web/src/views/terminal/components/sftp.vue
+++ b/web/src/views/terminal/components/sftp.vue
@@ -100,7 +100,17 @@
               clearable
             />
           </div>
-          <span class="path">{{ curPath }}</span>
+          <el-input
+            v-if="showPathInput"
+            ref="pathInputRef"
+            v-model="pathInput"
+            class="path-input"
+            size="small"
+            clearable
+            @blur="showPathInput = false"
+            @keyup.enter="handleInputPath"
+          />
+          <span v-else class="path" @click="handleShowPathInput">{{ curPath }}</span>
           <div v-if="showFileProgress">
             <span>{{ curUploadFileName }}</span>
             <el-progress
@@ -201,6 +211,10 @@ const uploadFileRef = ref(null)
 const uploadDirRef = ref(null)
 const forbiddenAction = ref(false)
 
+const pathInputRef = ref(null)
+const showPathInput = ref(false)
+const pathInput = ref('')
+
 const token = computed(() => $store.token)
 const curPath = computed(() => paths.value.join('/').replace(/\/{2,}/g, '/'))
 const fileList = computed(() => childDir.value.filter(({ name }) => name.includes(filterKey.value)))
@@ -616,6 +630,20 @@ const getPath = (name = '') => {
   return curPath.value.length === 1 ? `/${ name }` : `${ curPath.value }/${ name }`
 }
 
+const handleShowPathInput = () => {
+  showPathInput.value = true
+  pathInput.value = curPath.value
+  $nextTick(() => {
+    pathInputRef.value.focus()
+  })
+}
+const handleInputPath = () => {
+  if (forbiddenAction.value) return $message.warning('需等待当前任务完成')
+  // socket.value.emit('input_path', curPath.value)
+  showPathInput.value = false
+  openDir(pathInput.value)
+}
+
 defineExpose({
   openDir
 })
@@ -670,11 +698,20 @@ defineExpose({
         }
         .filter-input {
           width: 200px;
+          min-width: 200px;
           margin: 0 20px 0 10px;
         }
+        .path-input {
+          width: 450px;
+          min-width: 450px;
+        }
         .path {
           flex: 1;
           user-select: all;
+          cursor: pointer;
+          &:hover {
+            color: var(--el-color-primary);
+          }
         }
         .up-file-progress-wrap {
           min-width: 200px;