import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.12

Rectangle {
    id:selectionRectangle
    Accessible.name: "kylin-aiassistant_Select_selectionRectangle"
    color:"white"
    enabled: true
    width:200
    height: 36
    radius: 8
    border.width: 1
    border.color: Qt.rgba(0/255, 0/255, 0/255,0.1)
    Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter  // 水平和垂直居中对齐

    property bool isMoreButtonPressed: false
    property int activeCommandID: -1
    property string  activeCommand: ""

    signal sigSendButtonText(string currentCommand, int currentCommandID)
    signal sigResizeRect(bool isMoreButtonPressed,int width, int height, int moreCommandStartPos)
    signal sigsettingButtonLeftClicked()
    signal sigDisableMorePage()
    signal sigShowToolTip(bool isShow)


    function getTruncateCommandLabel(text, maxChars) {
        let totalUnits = 0;
        let truncatedText = "";

        for (let i = 0; i < text.length; i++) {
            let currentChar = text.charAt(i);

            // 判断是否为中文字符
            if (currentChar >= '\u4E00' && currentChar <= '\u9FFF') {
                // 中文字符占用 2 个单位
                totalUnits += 2;
            } else {
                // 英文或其他字符占用 1 个单位
                totalUnits += 1;
            }

            // 如果总单位数超过了允许的最大值，则截断
            if (totalUnits > maxChars * 2) {
                truncatedText += "...";
                break;
            }

            // 追加当前字符
            truncatedText += currentChar;
        }

        return truncatedText;
    }

    //主要布局
    RowLayout{
        anchors.centerIn: parent
        Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter  // 水平和垂直居中对齐
        spacing: 4
        Layout.leftMargin: 4
        Layout.rightMargin: 4
        Row {
            id:selectCommandFlow
            Accessible.name: "kylin-aiassistant_Select_selectCommandFlow"
            height: 28
            width:childrenRect.width
            Layout.rightMargin: -6 //此处设置为负值是因为在计算左右间距时会由于spacing和下方的repeater中item的rightmargin重复，补充此值为抵消此间隙过大
            Repeater {
                id:selectRepeater
                Accessible.name: "kylin-aiassistant_Select_selectRepeater"
                visible: true
                model: commandTemplateListModel;
                delegate: Rectangle {
                    width:selectRect.width+12
                    height: 28
                    visible: index <3 //只显示前三个
                    Accessible.name: "kylin-aiassistant_Select_Rectangle"
                    RowLayout {
                        Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter  // 水平和垂直居中对齐
                        id:selectButtonLayout
                        Accessible.name: "kylin-aiassistant_Select_selectButtonLayout"
                        Layout.leftMargin: 4
                        Layout.rightMargin: 4
                        Rectangle{
                            id:selectRect
                            Accessible.name: "kylin-aiassistant_Select_selectRect"
                            //width: selectButtonText.implicitWidth +selectButtonIcon.implicitWidth + textLayout.leftPadding+textLayout.rightPadding;
                            width:textLayout.width
                            height:28;
                            color: "white"
                            radius: 4
                            Row{
                                leftPadding: 4
                                rightPadding: 4
                                anchors.centerIn: parent;
                                id:textLayout
                                Accessible.name: "kylin-aiassistant_Select_textLayout"
                                Rectangle{
                                    id: selectButtonIconRet
                                    width: 28
                                    height: 28
                                    color: "transparent"
                                    Image {
                                        id: selectButtonIcon
                                        Accessible.name: "kylin-aiassistant_Select_commandImage"
                                        source: iconPath
                                        anchors.centerIn: parent
                                    }
                                }

                                Text {
                                    id: selectButtonText;
                                    Accessible.name: "kylin-aiassistant_Select_selectButtonText"
                                    text: getTruncateCommandLabel(name, 8); // 中文不超过 8 个字符，英文不超过 16 个字符
                                    color: Qt.rgba(0/255, 0/255, 0/255,0.85)
                                    anchors.verticalCenter: parent.verticalCenter
                                }
                            }
                            MouseArea {
                                anchors.fill: parent
                                hoverEnabled: true
                                onEntered: {
                                    parent.color = Qt.rgba(0/255, 0/255, 0/255,0.15)
                                }
                                onExited: {
                                    parent.color = "white"
                                }
                                onPressed: {
                                    parent.color = Qt.rgba(0/255, 0/255, 0/255,0.2)
                                }
                                onClicked: {
                                    selectionRectangle.activeCommand = name
                                    selectionRectangle.activeCommandID = actorId
                                    selectionRectangle.sigSendButtonText(selectionRectangle.activeCommand, selectionRectangle.activeCommandID)
                                }
                                onReleased: {
                                    parent.color = "white"
                                }

                           }

                        }

                    }

                    }
               }
        }
        Rectangle {
            width: moreRect.visible ? 68 : 0;
            height: 28;
            color: Qt.rgba(38/255, 38/255, 38/255, 0.05);
            radius: 4
            id:moreRect
            visible: commandTemplateListModel.count() > 3
            Accessible.name: "kylin-aiassistant_Select_moreRect"
            RowLayout {
                anchors.centerIn: parent
                Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter  // 水平和垂直居中对齐
                Text { id: m_totalButton; text: qsTr("More"); color: Qt.rgba(0/255, 0/255, 0/255); Accessible.name: "kylin-aiassistant_Select_m_totalButton"}
                Image {
                    id: m_moreSvg
                    Accessible.name: "kylin-aiassistant_Select_m_moreSvg"
                    source: "qrc:/html/html/img/fold_down.svg"
                    visible: true
                }
            }
            MouseArea {
                anchors.fill: parent
                hoverEnabled: true
                propagateComposedEvents: true
                onEntered: {
                    parent.color = Qt.rgba(38/255, 38/255, 38/255,0.15);
                }
                onExited: {
                    parent.color = Qt.rgba(38/255, 38/255, 38/255, 0.05);
                }
                onPressed: {
                    parent.color = Qt.rgba(38/255, 38/255, 38/255, 0.25);
                }
                onReleased: {
                    parent.color = Qt.rgba(38/255, 38/255, 38/255, 0.05);
                }
                onClicked: {
                    isMoreButtonPressed =!isMoreButtonPressed
                    selectionRectangle.sigResizeRect(isMoreButtonPressed,selectionRectangle.width,selectionRectangle.height,selectCommandFlow.width);
                }

            }
        }
        Rectangle{
            width:1;
            height:16;
            visible: moreRect.visible
            color: Qt.rgba(38/255, 38/255, 38/255,0.15);
        }
        Rectangle {
            width: 30;
            height: 28;
            color: Qt.rgba(255/255, 255/255, 255/255)
            radius: 4
            id: menuRect
            Accessible.name: "kylin-aiassistant_Select_menuRect"
            Row {
                anchors.centerIn: parent
                Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter  // 水平和垂直居中对齐
                Image {
                    id: m_textSendButton
                    Accessible.name: "kylin-aiassistant_Select_textSendButton"
                    source: "qrc:/html/html/img/kylin-aiassistant-select.svg"
                    visible: true

                }
            }
            MouseArea {
                id:rightClickArea
                Accessible.name: "kylin-aiassistant_Select_rightClickArea"
                anchors.fill: parent
                hoverEnabled: true
                acceptedButtons: Qt.RightButton |Qt.LeftButton
                onEntered: {
                    parent.color = Qt.rgba(55/255, 144/255, 250/255,0.1);
                    selectionRectangle.sigShowToolTip(true);
                }
                onExited: {
                    parent.color = Qt.rgba(255/255, 255/255, 255/255);
                    selectionRectangle.sigShowToolTip(false);
                }
                onClicked: {
                    if(mouse.button === Qt.LeftButton || mouse.button === Qt.RightButton)
                    {
                        //显示右键菜单
                        selectionRectangle.sigsettingButtonLeftClicked()
                        parent.color = Qt.rgba(255/255, 255/255, 255/255);
                    }
                }

            }

        }


        }

    //响应当前qml中sigsendButtonText信号，设置在发送内容后隐藏更多按钮控制面板
    onSigSendButtonText:
    {
        //设置按钮的状态 发送指令后隐藏更多按钮控制面板
        isMoreButtonPressed =false
    }

    function onsigDisableMorePage(){
        isMoreButtonPressed =false
    }

    function calculateTotalWidth() {
        let totalWidth = 0;
        for (let i = 0; i < 3; i++) {
            let item = selectRepeater.itemAt(i);
            if (item) {
                totalWidth += item.width;
            }
        }
        console.log("当前划词指令repeater的宽度为"+totalWidth);
        return totalWidth;
    }

    function onsigUpdateModelAndSelectSize()
    {
        console.log("指令模板模型内容已经更新"+selectionRectangle.width);
        var repeaterTotalWidth = calculateTotalWidth();
        console.log("指令repeater宽度"+selectCommandFlow.width)

    }

    function onUpdateNewMessage(){
        var spacing = 0;
        if (menuRect.visible === true){
            spacing = 20;
        }
        selectionRectangle.width = selectCommandFlow.width +moreRect.width + menuRect.width +spacing;
        selectionRectangle.sigResizeRect(isMoreButtonPressed,selectionRectangle.width,selectionRectangle.height,selectCommandFlow.width);

    }
}


