fix:完成数据查看模块

src/DataView/APPDataview.vue

@@ -1,47 +1,56 @@
 <template>
-
-
-
     <a-layout style="height: 100vh; width: 100vw;">
         <a-layout-header>
             <menubardatavue></menubardatavue>
         </a-layout-header>
         <a-layout>
-            <a-layout-sider :resize-directions="['right']" style=" min-width: 200px;max-width: 50vw;">
+            <a-layout-sider :resize-directions="['right']" style=" min-width: 20vw;max-width: 50vw;">
                 <a-dropdown trigger="contextMenu" alignPoint :style="{ display: 'block' }">
-                    <GuiLeftSider class="lefttree" v-on:NodeClicked="ononeFilechoese"></GuiLeftSider>
+                    <GuiLeftSider class="lefttree" v-on:NodeClicked="ononeFilechoese"
+                        v-on:NodeDblClicked="onFileDblClick" v-on:FilesSelected="onFilesSelected"
+                        v-on:FolderClicked="onFolderClicked" v-on:FolderDblClicked="onFolderDblClick"
+                        v-on:SaveFilesRequested="onSaveFilesRequested" v-on:reset="resetTreeData">
+                    </GuiLeftSider>
                     <template #content>
-                        <a-doption>Option 1</a-doption>
-                        <a-doption>Option 2</a-doption>
-                        <a-doption>Option 3</a-doption>
+                        <a-doption @click="onShowCurvesClick">显示曲线</a-doption>
+                        <!-- <a-doption>Option 2</a-doption> -->
+                        <!-- <a-doption>Option 3</a-doption> -->
                     </template>
                 </a-dropdown>
             </a-layout-sider>
             <a-layout-content class="right">
                 <GuiForDataShow ref="GuiForDataShow"></GuiForDataShow>
-            
             </a-layout-content>
         </a-layout>
-        <a-layout-footer>Footer</a-layout-footer>
-    </a-layout>
+        <!-- <a-layout-footer>Footer</a-layout-footer> -->
 
+        <!-- 保存文件弹窗 -->
+        <SaveFileDialog v-model:visible="showSaveDialog" :files="filesToSave" @save="handleSaveFiles"
+            @cancel="handleCancelSave" />
+    </a-layout>
 </template>
 
 <script>
 import menubardatavue from './menuvue/menubar.vue';
 import GuiForDataShow from './vuecomponents/GuiForDataShow.vue';
 import GuiLeftSider from './vuecomponents/GuiLeftSider.vue';
+import SaveFileDialog from './vuecomponents/SaveFileDialog.vue';
+import { fs } from '@tauri-apps/api';
+
 export default {
     name: 'APPDataview',
     components: {
         menubardatavue,
         GuiForDataShow,
-        GuiLeftSider
+        GuiLeftSider,
+        SaveFileDialog
     },
     data() {
         return {
             // 初始化数据
             message: '欢迎使用 Vue!',
+            selectedFilePath: null, // 存储当前选中的文件路径
+            selectedFilePaths: [], // 存储多选的文件路径
             treeData: [
                 {
                     title: 'Trunk 0-0',
@@ -73,13 +82,113 @@ export default {
                         },
                     ],
                 },
-            ]
+            ],
+            showSaveDialog: false,
+            filesToSave: [],
         }
     },
     methods: {
-        // 方法定义
-    }
+        // 处理单个文件选择（单击）
+        async ononeFilechoese(filePath) {
+            // console.log('选中文件路径:', filePath);
+            // 只记录选中的文件路径，不立即加载数据
+            this.selectedFilePath = filePath;
+        },
+
+        // 处理文件双击事件
+        async onFileDblClick(filePath) {
+            // console.log('双击文件路径:', filePath);
+            // 双击时加载数据
+            this.$refs.GuiForDataShow.onloaddata([filePath]);
+        },
+
+        // 处理多个文件选择（当使用Shift或Ctrl多选时）
+        async onFilesSelected(filePaths) {
+            // console.log('多选文件路径:', filePaths);
+            // 存储多选的文件路径
+            this.selectedFilePaths = filePaths;
+            // 多选时，可以选择不自动加载数据，等待用户进一步操作
+            if (filePaths && filePaths.length > 0) {
+                this.selectedFilePath = filePaths[0];
+            }
+        },
+
+        // 处理文件夹点击事件
+        async onFolderClicked(folderPath, childFilePaths) {
+            // console.log('选中文件夹:', folderPath);
+            // console.log('文件夹下的文件:', childFilePaths);
+            // 存储文件夹下的文件路径
+            this.selectedFilePaths = childFilePaths;
+        },
+
+        // 处理文件夹双击事件
+        async onFolderDblClick(folderPath, childFilePaths) {
+            // console.log('双击文件夹:', folderPath);
+            // console.log('文件夹下的文件:', childFilePaths);
+
+            // 如果文件夹下有文件，则加载所有文件
+            if (childFilePaths && childFilePaths.length > 0) {
+                // 将所有文件路径传递给 GuiForDataShow 组件
+                this.$refs.GuiForDataShow.onloaddata(childFilePaths);
+            }
+        },
+
+        // 处理"显示曲线"菜单项点击事件
+        async onShowCurvesClick() {
+            // console.log('点击显示曲线菜单项');
+            // 如果有多选文件，则加载所有选中的文件
+            if (this.selectedFilePaths && this.selectedFilePaths.length > 0) {
+                // console.log('加载多选文件:', this.selectedFilePaths);
+                this.$refs.GuiForDataShow.onloaddata(this.selectedFilePaths);
+            } else if (this.selectedFilePath) {
+                // 如果只有单选文件，则加载单个文件
+                // console.log('加载单选文件:', this.selectedFilePath);
+                this.$refs.GuiForDataShow.onloaddata(this.selectedFilePath);
+            }
+        },
+
+        resetTreeData() {
+            this.selectedFilePaths = []
+            this.$refs.GuiForDataShow.onloaddata(this.selectedFilePaths);
+        },
+
+        // 处理保存文件请求
+        onSaveFilesRequested(selectedFiles) {
+            this.filesToSave = selectedFiles
+            this.showSaveDialog = true
+        },
+        // 处理保存文件
+        async handleSaveFiles(saveData) {
+            try {
+                const { files, location } = saveData
+
+                for (const file of files) {
+                    // 构建目标文件路径
+                    const fileName = file.label
+                    const targetPath = `${location}/${fileName}`
+
+                    // 复制文件
+                    await fs.copyFile(file.path, targetPath)
+                }
+
+                this.$message.success(`成功保存 ${files.length} 个文件到 ${location}`)
+            } catch (error) {
+                console.error('保存文件失败:', error)
+                alert('保存文件失败: ' + error.message)
+            }
+        },
+
+        // 取消保存
+        handleCancelSave() {
+            this.showSaveDialog = false
+            this.filesToSave = []
+        }
+    },
+
+
+
 }
+
 </script>
 
 <style scoped>
@@ -87,12 +196,12 @@ export default {
 h1 {
     color: #42b983;
 }
+
 .right {
-  flex: 1;
-  background-color: #fff;
-  padding: 20px;
-  overflow: auto;
-  height: 100%;
-  width: 100%;
+    flex: 1;
+    background-color: #f3f5fa;
+    overflow: auto;
+    height: 100%;
+    width: 100%;
 }
 </style>