feat: enable multi-choose in FileManager

innocommerce · Jan 25, 2025 · ef272c7 · ef272c7
1 parent 9519fd3
commit ef272c7
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 11 deletions.
diff --git a/innopacks/panel/resources/views/file_manager/iframe.blade.php b/innopacks/panel/resources/views/file_manager/iframe.blade.php
@@ -2,10 +2,28 @@
 
 @section('title', __('panel/menu.file_manager'))
 
+@push('footer')
+<script>
+    // 创建底部按钮的 Vue 实例
+    new Vue({
+        el: '#bottom-btns',
+        methods: {
+            handleConfirm() {
+                // 获取主 Vue 实例并调用其方法
+                const mainApp = document.querySelector('#app').__vue__;
+                if (mainApp && typeof mainApp.confirmSelection === 'function') {
+                    mainApp.confirmSelection();
+                }
+            }
+        }
+    });
+</script>
+@endpush
+
 @include('panel::file_manager.main')
 
 @section('page-bottom-btns')
-    <div class="text-center">
-        <button class="btn btn-primary" onclick="window.app.confirmSelection()">选择提交</button>
+    <div class="text-center" id="bottom-btns">
+        <button class="btn btn-primary" @click="handleConfirm">选择提交</button>
     </div>
 @endsection
diff --git a/innopacks/panel/resources/views/file_manager/main.blade.php b/innopacks/panel/resources/views/file_manager/main.blade.php
@@ -1745,14 +1745,17 @@ class="file-card-context-menu"
                     this.copyDialog.visible = true;
                 },
                 handleFileClick(event, file) {
-                    if (this.isDragging) return; // 如果正在拖拽，不处理点击事件
+                    if (this.isDragging) return;
 
-                    if (this.isMultiSelectMode) {
-                        this.toggleFileSelect(file);
-                    } else if (this.isIframeMode && !file.is_dir) {
-                        // 如果是 iframe 模式且点击的是文件（不是文件夹），直接选择并返回
-                        window.parent.fileManagerCallback(file);
-                        parent.layer.closeAll();
+                    if (this.isIframeMode && !file.is_dir) {
+                        if (window.fileManagerConfig.multiple) {
+                            // 多选模式：切换选择状态
+                            this.toggleFileSelect(file);
+                        } else {
+                            // 单选模式：直接返回并关闭
+                            window.parent.fileManagerCallback(file);
+                            parent.layer.closeAll();
+                        }
                     } else {
                         this.selectedFiles = [file.id || file.path];
                     }
@@ -2547,7 +2550,7 @@ class="file-card-context-menu"
 
                 // 处理树节点离开拖拽
                 handleTreeDragLeave(event, node) {
-                    // 检查鼠��是否真的离开了目标元素及其子元素
+                    // 检查鼠是否真的离开了目标元素及其子元素
                     const relatedTarget = event.relatedTarget;
                     const currentTarget = event.currentTarget;
 
@@ -2749,10 +2752,22 @@ class="file-card-context-menu"
                 // 确认选择（多选模式）
                 confirmSelection() {
                     if (this.isIframeMode && window.parent.fileManagerCallback) {
+                        if (this.selectedFiles.length === 0) {
+                            this.$message.warning('请至少选择一个文件');
+                            return;
+                        }
+
                         const selectedFiles = this.files.filter(file =>
                             this.selectedFiles.includes(file.id || file.path)
                         );
-                        window.parent.fileManagerCallback(selectedFiles);
+
+                        if (window.fileManagerConfig.multiple) {
+                            // 多选模式：返回数组
+                            window.parent.fileManagerCallback(selectedFiles);
+                        } else {
+                            // 单选模式：返回单个文件
+                            window.parent.fileManagerCallback(selectedFiles[0]);
+                        }
                         parent.layer.closeAll();
                     }
                 }