<!--
简述：支持选择目录，遍历返回文件树。
注意：配置好 fs:scope 的权限范围，否则会报错 forbidden path
文件树示例：
{
    "path": "root-path/root",
    "name": "root",
    "directory": true,
    "nodes": [
        {
            "path": "root-path/root/folder1",
            "name": "folder1",
            "directory": true,
            "nodes": [
                {
                    "path": "root-path/root/folder1/folder1-file2",
                    "name": "folder1-file2.txt.md",
                    "suffix": "md",
                    "directory": false,
                },
            ]
        },
        {
            "path": "root-path/root/file3",
            "name": "file3.txt",
            "suffix": "txt",
            "directory": false,
        },
    ]
}
-->
<template>
    <Button type="primary" @click="selectFolder">选择目录</Button>
</template>

<script>
import { join } from '@tauri-apps/api/path';
import { open } from '@tauri-apps/plugin-dialog';
import { readDir } from '@tauri-apps/plugin-fs';

export default {
    props: {
        rootPath: {
            type: String,
            required: false,
            default: ''
        },
    },
    mounted() {
        // 如果父组件已指定了初始目录，则遍历返回对应文件树
        this.exposeTreeData(this.rootPath)
    },
    methods: {
        async exposeTreeData(folderPath) {
            if (folderPath != null && folderPath.length > 0) {
                const folderTreeData = await this.readDirRecursively(folderPath);
                this.$emit('folder-selected', folderTreeData);
            }
        },
        async selectFolder() {
            const folderPath = await open(
                {
                    filters: [{ name: 'All Files', extensions: ['.'] }],
                    directory: true
                }
            );
            if (folderPath) {
                // 告诉父组件，rootPath 的值已变化
                this.$emit('update:rootPath', folderPath)
                await this.exposeTreeData(folderPath)
            }
        },
        // 遍历文件夹，返回文件树
        async readDirRecursively(folderPath) {
            // 拼接得到当前文件夹路径
            let folderTreeNode = {
                "path": folderPath,
                "name": folderPath.split('/').pop(),
                "nodes": [],
                "directory": true,
            }

            // 尝试读取 folderPath 目录下所有实体
            let entries;
            try {
                entries = await readDir(folderPath);
            } catch (err) {
                let errorMessage = ""
                if (err.startsWith("forbidden path")) {
                    errorMessage = "no permission. " + err
                } else {
                    errorMessage = "readDir failed. " + err
                }
                this.$Message.error({
                    content: errorMessage,
                    duration: 10,
                    closable: true
                });
                return folderTreeNode
            }
            // 遍历该文件夹下所有实体
            for (const entry of entries) {
                const entryPath = await join(folderPath, entry.name);
                if (entry.isDirectory) {
                    folderTreeNode.nodes.push(await this.readDirRecursively(entryPath))
                } else {
                    let splitResult = entry.name.split('.')
                    let fileSuffix = splitResult.length > 1 ? splitResult.pop() : ''
                    folderTreeNode.nodes.push({
                        "path": entryPath,
                        "name": entry.name,
                        "suffix": fileSuffix,
                        "directory": false,
                    })
                }
            }
            return folderTreeNode
        }
    }
}
</script>