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

Item {
    anchors.fill: parent
    signal open(string note, string authorId)
    signal createNote
    width: parent.width - 8
    property ListModel noteListModel: ListModel {
        ListElement {
            uuid: "1"
            title: "超级无敌报错"
            brief: "file:///D:/academic/2023-qtBig/AicsKnowledgeBase_client/AicsKnowledgeBase/qml/component/NoteList.qml:41:21: Unable to assign [undefined] to QString"
            author: "admin"
            authorId: "345"
            pageView: 123
            stars: 27
            date: "2022-02-02"
        }
        ListElement {
            uuid: "2"
            title: "Qt布局"
            brief: "锚定（anchors）在确定父子组件之间，同级组件之间的相对位置时非常常用，若使用锚定方式确定子组件与父组件之间的位置关系，使用 top，bottom，left，right， topMargin，bottomMargin，leftMargin，rightMargin进行上下左右对齐，以及对齐后的留白距离。若要使子组件在父组件的水平，垂直居中，使用："
            author: "超级无敌长的账户名"
            authorId: "345"
            pageView: 123
            stars: 27
            date: "2022-02-02"
        }
        ListElement {
            uuid: "2"
            title: "Qt布局"
            brief: "锚定（anchors）在确定父子组件之间，同级组件之间的相对位置时非常常用，若使用锚定方式确定子组件与父组件之间的位置关系，使用 top，bottom，left，right， topMargin，bottomMargin，leftMargin，rightMargin进行上下左右对齐，以及对齐后的留白距离。若要使子组件在父组件的水平，垂直居中，使用："
            author: "超级无敌长的账户名"
            authorId: "345"
            pageView: 123
            stars: 27
            date: "2022-02-02"
        }
        ListElement {
            uuid: "2"
            title: "Qt布局"
            brief: "锚定（anchors）在确定父子组件之间，同级组件之间的相对位置时非常常用，若使用锚定方式确定子组件与父组件之间的位置关系，使用 top，bottom，left，right， topMargin，bottomMargin，leftMargin，rightMargin进行上下左右对齐，以及对齐后的留白距离。若要使子组件在父组件的水平，垂直居中，使用："
            author: "超级无敌长的账户名"
            authorId: "345"
            pageView: 123
            stars: 27
            date: "2022-02-02"
        }
    }

    RowLayout {
        height: 48
        anchors.left: parent.left
        anchors.right: parent.right
        anchors.leftMargin: 10
        anchors.rightMargin: 10
        FluText {
            text: "笔记列表"
            font.pixelSize: 18
            font.bold: true
        }
        FluButton {
            id: createNoteButton
            text: "新建笔记"
            Layout.alignment: Qt.AlignRight
            onClicked: {
                createNote()
            }
        }
    }

    FluScrollablePage {
        anchors.fill: parent
        anchors.topMargin: 50
        ColumnLayout {
            Layout.fillWidth: true
            spacing: 8
            Repeater {
                id: repeater
                model: noteListModel
                delegate: Rectangle {
                    id: noteListItemRect
                    Layout.fillWidth: true
                    height: 150
                    MouseArea {
                        anchors.fill: parent
                        onClicked: {
                            open(model.uuid, model.authorId)
                        }
                    }
                    NoteListItem {
                        id: noteListItem
                        uuid: model.uuid
                        width: parent.width
                        height: parent.height
                        title: model.title
                        date: model.date
                        brief: model.brief
                        pageView: model.pageView
                        author: model.author
                        authorId: model.authorId
                        stars: model.stars
                    }
                }
            }
        }
    }

    function setListModel(listModel) {
        repeater.model = listModel
        //console.log(listView.model.get(0).uuid)
    }
}