实现跨边界拖拽功能:支持从浏览器拖拽文件到系统
主要改进: - 使用 File System Access API 实现真正的跨应用边界文件传输 - 支持拖拽到窗口外自动触发系统保存对话框 - 智能路径记忆功能,记住用户上次选择的保存位置 - 多文件自动打包为 ZIP 格式 - 现代浏览器优先使用新 API,旧浏览器降级到传统下载 - 完整的视觉反馈和进度显示 技术实现: - 新增 useDragToSystemDesktop hook 处理系统级拖拽 - 扩展 Electron 主进程支持拖拽临时文件管理 - 集成 JSZip 库支持多文件打包 - 使用 IndexedDB 存储用户偏好的保存路径 - 优化文件管理器拖拽事件处理链 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -13,7 +13,8 @@ import {
|
||||
RefreshCw,
|
||||
Clipboard,
|
||||
Eye,
|
||||
Share
|
||||
Share,
|
||||
ExternalLink
|
||||
} from "lucide-react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
|
||||
@@ -47,6 +48,7 @@ interface ContextMenuProps {
|
||||
onPaste?: () => void;
|
||||
onPreview?: (file: FileItem) => void;
|
||||
hasClipboard?: boolean;
|
||||
onDragToDesktop?: () => void;
|
||||
}
|
||||
|
||||
interface MenuItem {
|
||||
@@ -77,7 +79,8 @@ export function FileManagerContextMenu({
|
||||
onRefresh,
|
||||
onPaste,
|
||||
onPreview,
|
||||
hasClipboard = false
|
||||
hasClipboard = false,
|
||||
onDragToDesktop
|
||||
}: ContextMenuProps) {
|
||||
const { t } = useTranslation();
|
||||
const [menuPosition, setMenuPosition] = useState({ x, y });
|
||||
@@ -204,6 +207,19 @@ export function FileManagerContextMenu({
|
||||
});
|
||||
}
|
||||
|
||||
// 拖拽到桌面菜单项(支持浏览器和桌面应用)
|
||||
if (hasFiles && onDragToDesktop) {
|
||||
const isModernBrowser = 'showSaveFilePicker' in window;
|
||||
menuItems.push({
|
||||
icon: <ExternalLink className="w-4 h-4" />,
|
||||
label: isMultipleFiles
|
||||
? `保存 ${files.length} 个文件到系统`
|
||||
: "保存到系统",
|
||||
action: () => onDragToDesktop(),
|
||||
shortcut: isModernBrowser ? "选择位置保存" : "下载到默认位置"
|
||||
});
|
||||
}
|
||||
|
||||
menuItems.push({ separator: true } as MenuItem);
|
||||
|
||||
if (isSingleFile && onRename) {
|
||||
|
||||
Reference in New Issue
Block a user