import QtQuick
import QtQuick.Layouts
import QtQuick.Controls
import FluentUI.Controls
import FluentUI.impl

Item {
    id: control

    signal clickMenuItem(var data)

    signal clickResource(var data)

    signal lockItem(var data)
    signal showItem(var data)

    ListModel{
        id: tab_model
        ListElement{
            title: "元素"
        }
        ListElement{
            title: "资源"
        }
        ListElement{
            title: "蓝图"
        }
    }

    MyTabBar {
        id: bar
        width: parent.width
        clip: true
        palette.window: "green"
        spacing: 20
        Repeater {
            model: tab_model
            MyTabButton {
                id: btn_tab
                text: model.title
                font.pointSize: 12
                implicitHeight: 50
                implicitWidth: 40
                // topPadding: 30
                palette.windowText: "#1B806A"
            }
        }
    }

    Component{
        id:comp_page
        Frame{
            anchors.fill: parent
            LeftProjectMenu{
                anchors.fill: parent
            }
        }
    }

    StackLayout {
        currentIndex: bar.currentIndex
        anchors{
            left: bar.left
            right: bar.right
            top: bar.bottom
            bottom: parent.bottom
            topMargin: 10
        }
        LeftProjectMenu{
            id: com_menu
            Layout.fillWidth: true
            Layout.fillHeight: true
            onClickItem: function(data) {
                control.clickMenuItem(data)
            }
            onLockItem: function(data) {
                control.lockItem(data)
            }
            onShowItem: function(data) {
                control.showItem(data)
            }
        }

        // 资源面板
        LeftResource{
            Layout.fillWidth: true
            Layout.fillHeight: true
            onClickResource: function(data) {
                control.clickResource(data)
            }

            // color: 'yellow'
            // LeftResource{
            //     anchors.fill: parent
            // }
        }
        Rectangle{
            Layout.fillWidth: true
            Layout.fillHeight: true
            color: 'cyan'
        }
    }

    function setMenuData(data) {
        com_menu.setMenuData(data)
    }

    function deleteMenuData(data) {
        com_menu.delMenuData(data)
    }
}