import QtQuick
import QtQuick.Controls
import "./app.js" as App
import "./js/config.js" as Conf
Rectangle {
    property var appId: App.appId
    property var plusFile: App.plusFile
    property var appList: []
    ListModel{
        id: appModel
    }
    Component.onCompleted: {

        updateAppList()
        common.initAppScript(appId, "sysapp", "sysapp.py", plusFile)
    }


    function updateAppList()
    {
        appModel.clear()
        common.updateAppList()
        appList = Conf.sys_app_list
        for(var i = 0; i < appList.length; i++)
        {
            var obj = {
                "name": appList[i].name,
                "icon": "./resource/" +appList[i].icon,
                "appPath": appList[i].app_path
            }
            appModel.append(obj)
        }
    }

    Rectangle {
        anchors.fill: parent
        gradient: Gradient {
            GradientStop { position: 0.0; color: "#ecf3fb" } // 左上角颜色       
            GradientStop { position: 1.0; color: "#b7d6fb" } // 右上角颜色
            orientation: Gradient.Horizontal
        }
        Rectangle {
            anchors.left: parent.left
            anchors.right: parent.right
            anchors.top: parent.top
            anchors.bottom: parent.bottom
            anchors.leftMargin: 10
            anchors.rightMargin: 10
            anchors.topMargin: 12
            anchors.bottomMargin: 10
           
            radius: 10
            color: "#ffffff"
            Component {
                id: contactDelegate
                Item {
                    width: grid.cellWidth
                    height: grid.cellHeight
                    Item{
                        width: grid.cellWidth
                        height: grid.cellHeight
                        Image{
                            id: imgIcon
                            width: 50
                            height: 50
                            source: icon
                            anchors.centerIn: parent
                        }
                        Item{
                            width: 120
                            height: 30
                  
                            anchors.horizontalCenter: parent.horizontalCenter
                            anchors.top: imgIcon.bottom
                            anchors.topMargin: 5
                            Text {
                                id: txName 
                                text: name
                                width: 120
                                wrapMode: Text.Wrap
                                maximumLineCount: 2
                                // 关键设置：文本内容在宽度范围内居中
                                horizontalAlignment: Text.AlignHCenter  // 水平居中[6,9](@ref)
                                verticalAlignment: Text.AlignVCenter    // 垂直居中[6,7](@ref)
                                font.family: "微软雅黑"
                                font.pointSize: 12
                                color: "#5b5b5b"
                            }
                        }
                      
                    }
                    
                    
                    MouseArea {
                        anchors.fill: parent
                        hoverEnabled: true
                        propagateComposedEvents: false
                        onEntered:{
                            imgIcon.scale = 1.03
                        }
                        onExited: {
                            imgIcon.scale = 1
                        }
                        
                        onPressed:(mouse)=> 
                        {
                            // mouse.accepted = false
                            // stackView.push(model.qmlfile)
                            // grid.currentIndex = index
                        }
                        onDoubleClicked:(mouse)=> {
                            console.info("double clicked")
                            console.info(model.appPath)
                            sysapp.open_App(model.appPath)
                        }
                    }     
                }
            }
            Item{
                id: gridItem
                anchors.centerIn: parent
                width: parent.width *5/6; height: parent.height - 200
                clip: true
                GridView {
                    id: grid
                    width: parent.width ; height: parent.height
                    anchors.fill: parent
                    cellWidth: 150; cellHeight: 160
                    model: appModel
                    delegate: contactDelegate
                    focus: true
                }
            }
            Text{
                anchors.bottom: gridItem.top
                anchors.left: gridItem.left
                anchors.bottomMargin: 20
                anchors.leftMargin: 25
                font.pointSize: 20
                color: "#000000"
                text: "应用列表"
            }
        }
    }

}