AicsKnowledgeBase_client/AicsKnowledgeBase/qml/component/FileList.qml

import QtQuick 2.15
import QtQuick.Layouts
import FluentUI
import "qrc:///AicsKnowledgeBase/qml/global"

Window {
    id: fileListTestWindow
    visible: true
    width: 800
    height: 600
    title: "File List Test1"
    signal search(string tag)
    signal open(string file)
    Item {
        anchors.fill: parent
        ListView {
            id: listView
            anchors.fill: parent
            spacing: 10
            header: fileListItemHeader
            model: fileListModel
            delegate: fileListItemDelegate
            Component.onCompleted: {
                update()
            }
        }
        Component {
            id: fileListItemHeader
            Item {
                id: fileListItemHeaderItem
                width: ListView.view.width
                height: 48
                RowLayout {
                    FluBreadcrumbBar {
                        id: header
                        width: parent.width
                        height: parent.height
                        separator: ">"
                        items: []
                        onClickItem: function (model) {
                            if (model.index + 1 !== count()) {
                                items = items.slice(0, model.index + 1)
                            }
                        }
                        onItemsChanged: {
                            fileListItemHeaderItem.update()
                        }
                    }
                    // back to folder button
                    FluIconButton {
                        Layout.alignment: Qt.AlignVCenter
                        id: backButton
                        width: 24
                        height: 24
                        iconSource: FluentIcons.ChromeBack
                        onClicked: {
                            if (header.count() > 0) {
                                header.items = header.items.slice(
                                            0, header.count() - 1)
                            }
                            fileListItemHeaderItem.update()
                        }
                    }
                }

                function add(folderName, uuid) {
                    console.log(header.items)
                    header.items = header.items.concat([{
                                                            "title": folderName,
                                                            "uuid": uuid
                                                        }])
                }
                function update() {
                    var uuid = header.items.length
                            === 0 ? "null" : header.items[header.items.length - 1].uuid
                    Request.get(uuid, function (response) {
                        var data = JSON.parse(response)
                        console.log(data.knowledgeFileAttribute)
                        fileListModel.clear()
                        var files = data.children
                        for (var i = 0; i < files.length; i++) {
                            var file = files[i]
                            console.log(file.name)
                            var modelItem = {
                                "title": file.name,
                                "uuid": file.id,
                                "date": file.createTime
                            }
                            if (file.knowledgeFileAttribute === null) {
                                modelItem.type = "folder"
                                modelItem.isDir = true
                                modelItem.size = 0
                            } else {
                                modelItem.isDir = false
                                modelItem.type = file.knowledgeFileAttribute.suffix
                                modelItem.size = file.knowledgeFileAttribute.size
                                modelItem.brief = file.knowledgeFileAttribute.brief
                                modelItem.pageView = file.knowledgeFileAttribute.pageView
                                modelItem.stars = 0
                                // merge file.knowledgeFileAttribute.tags array to a string
                                var tagString = ""
                                for (var j = 0; j < file.knowledgeFileAttribute.tags.length; j++) {
                                    if (j != 0)
                                        tagString = tagString + ","
                                    tagString = tagString + file.knowledgeFileAttribute.tags[j].name
                                }
                                modelItem.tags = tagString
                            }
                            fileListModel.append(modelItem)
                        }
                        listView.currentIndex = -1
                    })
                }
            }
        }
        Component {
            id: fileListItemDelegate
            Rectangle {
                id: fileListItemRect
                width: ListView.view.width
                height: 120
                color: !ListView.isCurrentItem ? "lightgray" : "red"
                FileListItem {
                    id: fileListItem
                    uuid: model.uuid
                    width: parent.width
                    height: parent.height
                    title: model.title
                    isDir: model.isDir
                    date: model.date
                    brief: isDir ? "" : model.brief
                    type: isDir ? "FOLDER" : model.type
                    pageView: isDir ? 0 : model.pageView
                    size: isDir ? 0 : model.size
                    stars: isDir ? 0 : model.stars
                    // split string to array
                    tags: isDir ? [] : model.tags.split(",")
                    onTagClicked: {
                        emit: search(tag)
                        console.log(tag)
                    }
                }
                function doubleClicked() {
                    listView.currentIndex = index
                    if (model.isDir) {
                        listView.headerItem.add(model.title, model.uuid)
                    } else {
                        emit: open(model.uuid)
                    }
                }
            }
        }
        ListModel {
            id: fileListModel
            //            ListElement {
            //                title: "File 1"
            //                isDir: true
            //                brief: "This is a test file"
            //                type: "FOLDER"
            //            }
            //            ListElement {
            //                uid: "2"
            //                title: "File 2"
            //                isDir: false
            //                brief: "This is a test file"
            //                size: 500
            //                type: "WORD"
            //                date: "2020-09-09"
            //                pageView: 100
            //                stars: 10
            //            }
            //            ListElement {
            //                uid: "3"
            //                title: "File 3"
            //                isDir: false
            //                brief: "This is a test file"
            //                type: "PPT"
            //                date: "2020-09-09"
            //                pageView: 100
            //                size: 10200000022
            //                stars: 10
            //            }
        }
    }
}