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

Item {
    id: control
    signal clickSee(var item)

    anchors.fill: parent
    Component{
        id: item_project

        Rectangle {
            color: "#292929"
            width: 280
            height: 140

            // MouseArea {
            //     anchors.fill: parent
            //     hoverEnabled: true
            //     onEntered: parent.color = "#000000"
            //     onExited: parent.color = "#292929"
            //     onClicked: {
            //       // selectedSegment = model.text
            //       // segmentDialog.close()
            //     }
            // }

            Image {
                Layout.alignment: Qt.AlignHCenter
                fillMode: Image.PreserveAspectFit/*保持原始横纵比*/
                source: "qrc:/qt/qml/Gallery/res/image/card/bg_card.png"
                ColumnLayout{
                    spacing: 10
                    RowLayout{
                        Layout.leftMargin: 10
                        Layout.topMargin: 10
                        Label{
                          text: model.title
                          Layout.preferredWidth: 205
                          font.pointSize: 12
                          elide: Text.ElideRight
                        }
                        Button{
                            text: "已启用"
                        }
                    }
                    RowLayout{
                        Layout.leftMargin: 10
                        Label{
                            text: "运营商："
                        }
                        Label{
                            text: model.company
                        }
                    }
                    RowLayout{
                        Layout.leftMargin: 10
                        Label{
                            text: "创建时间："
                        }
                        Label{
                            text: model.time
                        }
                    }
                    RowLayout{
                        Layout.alignment: Qt.AlignHCenter
                        // anchors.horizontalCenter: parent.horizontalCenter
                        IconButton{
                           text: "编辑"
                           icon.name: FluentIcons.graph_Edit
                           icon.width: 10
                           icon.height: 10
                           spacing: 3
                           onClicked: {

                           }
                        }
                        IconButton{
                           text: "设计"
                           icon.name: FluentIcons.graph_RedEye
                           icon.width: 10
                           icon.height: 10
                           spacing: 3
                           onClicked: {
                                control.clickSee(model)
                           }
                        }
                        IconButton{
                           text: "复制"
                           icon.name: FluentIcons.graph_Copy
                           icon.width: 10
                           icon.height: 10
                           spacing: 3
                        }
                        IconButton{
                           text: "删除"
                           icon.name: FluentIcons.graph_Delete
                           icon.width: 10
                           icon.height: 10
                           spacing: 3
                           highlighted: true
                           FluentUI.primaryColor: Qt.rgba(220/255,53/255,69/255,1)
                           onClicked: confirmationDialog.open()
                           Dialog {
                               id: confirmationDialog
                               x: Math.ceil((parent.width - width) / 2)
                               y: Math.ceil((parent.height - height) / 2)
                               width: 200
                               parent: Overlay.overlay
                               modal: true
                               title: "删除确认"
                               standardButtons: Dialog.Yes | Dialog.No
                               Column {
                                   spacing: 20
                                   anchors.fill: parent
                                   Label {
                                       text: qsTr("您确认要删除吗?")
                                   }
                               }
                               onAccepted: {
                                   console.log("delid==" + model.index)
                                   list_model.remove(model.index)
                               }
                            }
                        }
                    }
                }
            }
        }
    }

    ListModel{
        id: list_model
        ListElement {
            uuid: "1"
            title: "赋新站25年1月计费（充电）"
            company: "绿电智联（浙江）数据科技有限公司"
            time: "2025-01-05 12:00:00"
            desc: ""
            img: "qrc:/qt/qml/Gallery/res/image/card/bg_card.png"
        }
        ListElement {
            uuid: "2"
            title: "河津站"
            company: "绿电智联（浙江）数据科技有限公司"
            time: "2025-01-05 12:00:00"
            desc: ""
            img: "qrc:/qt/qml/Gallery/res/image/card/bg_card.png"
        }
    }

    // 新建项目弹框
    WindowResultLauncher{
        id: projectNew
        path: "/newProject"
        onResult: (data)=>{
                      console.log(data.title)
            var d = new Date()
            var year = d.getFullYear()
            var month = d.getMonth() + 1
            var day = d.getDate()
            var str_time = year + "-" + (month >= 10 ? month : "0" + month) + "-" + (day >= 10 ? day : "0" + day)

            list_model.append({title: data.title, company: data.company, desc: data.desc, time: str_time, uuid: control.generateUUID()})
            // var ml = Qt.createComponent("qrc:/qt/qml/FluentUI/Controls/PaneItemExpander.qml");
            // if (ml.status === Component.Ready) {
            //     var menu = ml.createObject(nav_menu,{title: data.title })
            //     menu.icon.name = FluentIcons.graph_Home
            //     menu.icon.color = Colors.white
            //     control.originalItems.push(menu)
            // }
        }
    }
    ////////////

    ColumnLayout{
        anchors.fill: parent
        Rectangle{
            Layout.fillWidth: true
            Layout.preferredHeight: 40
            color: "#000"

            Button {
                anchors.right: parent.right
                anchors.rightMargin: 10
                anchors.top: parent.top
                anchors.topMargin: 5
                width: 100
                text: "添加项目"
                highlighted: true
                onClicked: {
                    projectNew.launch({})
                }
            }
        }
        Rectangle{
            Layout.fillWidth: true
            Layout.fillHeight: true
            color: "transparent"
            GridView {
                anchors.fill: parent
                cellWidth: 300
                cellHeight: 160
                model: list_model
                delegate: item_project
                clip: true
                boundsBehavior:  Flickable.StopAtBounds
            }
        }
    }

    function generateUUID() {
        var d = new Date().getTime();
        var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
          var r = (d + Math.random()*16)%16 | 0;
          d = Math.floor(d/16);
          return (c=='x' ? r : (r&0x3|0x8)).toString(16);
        });
        return uuid;
    }
}