feat: ✨ Support graphic file manager

README-CN.md

@@ -214,10 +214,9 @@ Windows 及 Linux 端内部集成了 Gnirehtet， 用于提供 PC 到安卓设
 19. 灵活启动镜像 ✅
 20. 批量处理 ✅
 21. 计划任务 ✅
-22. 对设备进行分组 🚧
-23. 文件传输助手 🚧
-24. 通过界面管理设备文件 🚧
-25. 游戏键位映射 🚧
+22. 图形化文件管理器 ✅
+23. 对设备进行分组 🚧
+24. 游戏键位映射 🚧
 
 ## 常见问题
 

README.md

@@ -212,10 +212,9 @@ Refer to [scrcpy/doc/shortcuts](https://github.com/Genymobile/scrcpy/blob/master
 19. Flexible mirroring launch ✅
 20. Batch processing ✅
 21. Scheduled tasks ✅
-22. Device grouping 🚧
-23. File transfer assistant 🚧
-24. Manage device files via interface 🚧
-25. Game key mapping 🚧
+22. Graphical file manager ✅ 
+23. Device grouping 🚧
+24. Game key mapping 🚧
 
 ## FAQ
 

electron/exposes/adbkit/index.js

@@ -187,28 +187,6 @@ const clearOverlayDisplayDevices = async (deviceId) => {
   )
 }
 
-const push = async (
-  id,
-  filePath,
-  { progress, savePath = `/sdcard/Download/${path.basename(filePath)}` } = {},
-) => {
-  const res = await client.getDevice(id).push(filePath, savePath)
-
-  return new Promise((resolve, reject) => {
-    res.on('progress', (stats) => {
-      progress?.(stats)
-    })
-
-    res.on('end', () => {
-      resolve(savePath)
-    })
-
-    res.on('error', (err) => {
-      reject(err)
-    })
-  })
-}
-
 const watch = async (callback) => {
   const tracker = await client.trackDevices()
   tracker.on('add', async (ret) => {
@@ -233,18 +211,63 @@ const watch = async (callback) => {
   return close
 }
 
-async function getFiles(id, path) {
-  const value = await client.getDevice(id).readdir(path)
+async function readdir(id, filePath) {
+  const value = await client.getDevice(id).readdir(filePath)
 
   return value.map(item => ({
     ...item,
+    id: [filePath, item.name].join('/'),
     type: item.isFile() ? 'file' : 'directory',
     name: item.name,
     size: formatFileSize(item.size),
     updateTime: dayjs(item.mtime).format('YYYY-MM-DD HH:mm:ss'),
   }))
 }
 
+async function push(id, filePath, args = {}) {
+  const { progress, savePath = `/sdcard/Download/${path.basename(filePath)}` }
+    = args
+
+  const transfer = await client.getDevice(id).push(filePath, savePath)
+
+  return new Promise((resolve, reject) => {
+    transfer.on('progress', (stats) => {
+      progress?.(stats)
+    })
+
+    transfer.on('end', () => {
+      resolve(savePath)
+    })
+
+    transfer.on('error', (err) => {
+      reject(err)
+    })
+  })
+}
+
+async function pull(id, filePath, args = {}) {
+  const { progress, savePath = path.resolve('../', path.basename(filePath)) }
+    = args
+
+  const transfer = await client.getDevice(id).pull(filePath)
+
+  return new Promise((resolve, reject) => {
+    transfer.on('progress', (stats) => {
+      progress?.(stats)
+    })
+
+    transfer.on('end', () => {
+      resolve(savePath)
+    })
+
+    transfer.on('error', (err) => {
+      reject(err)
+    })
+
+    transfer.pipe(fs.createWriteStream(savePath))
+  })
+}
+
 export default () => {
   const binPath = appStore.get('common.adbPath') || adbPath
 
@@ -269,7 +292,8 @@ export default () => {
     display,
     clearOverlayDisplayDevices,
     push,
+    pull,
     watch,
-    getFiles,
+    readdir,
   }
 }

src/components/Device/components/ControlBar/FileManage/FileDialog/AddPopover/index.vue

@@ -0,0 +1,46 @@
+<template>
+  <el-popover
+    ref="popoverRef"
+    placement="bottom-start"
+    :width="300"
+    trigger="click"
+    @hide="onHide"
+  >
+    <template #reference>
+      <slot name="reference"></slot>
+    </template>
+    <div class="flex items-center space-x-2">
+      <el-input
+        v-model="dirname"
+        :placeholder="$t('common.input.placeholder')"
+        clearable
+        class="flex-1 w-0"
+      ></el-input>
+
+      <el-button type="primary" class="flex-none" @click="handleConfirm">
+        {{ $t('common.confirm') }}
+      </el-button>
+    </div>
+  </el-popover>
+</template>
+
+<script setup>
+const emit = defineEmits(['success'])
+
+const defaultText = 'NewFolder'
+
+const dirname = ref(defaultText)
+
+const popoverRef = ref()
+
+function onHide() {
+  dirname.value = defaultText
+}
+
+function handleConfirm() {
+  emit('success', dirname.value)
+  popoverRef.value.hide()
+}
+</script>
+
+<style></style>