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 // } } } }