AicsKnowledgeBase_client/AicsKnowledgeBase/qml/component/CustomAppBar.qml

import QtQuick
import QtQuick.Controls
import QtQuick.Window
import QtQuick.Layouts
import FluentUI

Rectangle {
    property string username: "用户名"
    property string title: ""
    property string darkText: "夜间模式"
    property string minimizeText: "最小化"
    property string restoreText: "向下还原"
    property string maximizeText: "最大化"
    property string closeText: "关闭"
    property color textColor: FluTheme.dark ? "#FFFFFF" : "#000000"
    property color minimizeNormalColor: Qt.rgba(0, 0, 0, 0)
    property color minimizeHoverColor: FluTheme.dark ? Qt.rgba(1, 1, 1,
                                                               0.1) : Qt.rgba(
                                                           0, 0, 0, 0.06)
    property color maximizeNormalColor: Qt.rgba(0, 0, 0, 0)
    property color maximizeHoverColor: FluTheme.dark ? Qt.rgba(1, 1, 1,
                                                               0.1) : Qt.rgba(
                                                           0, 0, 0, 0.06)
    property color closeNormalColor: Qt.rgba(0, 0, 0, 0)
    property color closeHoverColor: Qt.rgba(251 / 255, 115 / 255, 115 / 255, 1)
    property bool showDark: false
    property bool titleVisible: true
    property bool isMac: FluTools.isMacos()
    property color borerlessColor: FluTheme.dark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
    property var maxClickListener: function () {
        if (d.win.visibility === Window.Maximized)
            d.win.visibility = Window.Windowed
        else
            d.win.visibility = Window.Maximized
    }
    property var minClickListener: function () {
        d.win.visibility = Window.Minimized
    }
    property var closeClickListener: function () {
        d.win.close()
    }
    property var darkClickListener: function () {
        if (FluTheme.dark) {
            FluTheme.darkMode = FluDarkMode.Light
        } else {
            FluTheme.darkMode = FluDarkMode.Dark
        }
    }
    id: root
    color: Qt.rgba(0, 0, 0, 0)
    height: visible ? 44 : 0
    opacity: visible
    z: 65535
    Item {
        id: d
        property var win: Window.window
        property bool isRestore: win && Window.Maximized === win.visibility
        property bool resizable: win
                                 && !(win.minimumHeight === win.maximumHeight
                                      && win.maximumWidth === win.minimumWidth)
    }
    TapHandler {
        onTapped: if (tapCount === 2)
                      btn_maximize.clicked()
        gesturePolicy: TapHandler.DragThreshold
    }
    DragHandler {
        target: null
        grabPermissions: TapHandler.CanTakeOverFromAnything
        onActiveChanged: if (active) {
                             d.win.startSystemMove()
                         }
    }
    FluText {
        text: title
        anchors {
            verticalCenter: parent.verticalCenter
            left: isMac ? undefined : parent.left
            leftMargin: isMac ? undefined : 10
            horizontalCenter: isMac ? parent.horizontalCenter : undefined
        }
        visible: root.titleVisible
        color: root.textColor
    }
    RowLayout {
        anchors.right: parent.right
        height: root.height
        spacing: 0

        Item {
            height: 32
            width: 32
            Layout.rightMargin: 10
            FluIconButton {
                id: btn_transfer
                anchors.fill: parent
                onClicked: {
                    transferList_popup.open()
                }
            }
            Image {
                height: 18
                width: 18
                anchors.centerIn: parent
                source: "qrc:/AicsKnowledgeBase/res/transfer.svg"
            }

            TransferListPopup {
                id: transferList_popup
            }
        }

        FluIconButton {
            id: btn_note
            height: 32
            width: 32
            Layout.rightMargin: 10
            iconSource: FluentIcons.PenPalette
            iconSize: 14
        }

        Text {
            Layout.margins: {
                right: 10
            }
            text: username
        }

        Item {
            Layout.rightMargin: 10
            width: 32
            height: 32
            Rectangle {
                anchors.fill: parent
                color: "#d2d2d2"
                radius: 50
            }
            Text {
                anchors.centerIn: parent
                text: username[0]
                color: "#8a8a8a"
            }
        }

        RowLayout {
            Layout.alignment: Qt.AlignVCenter
            Layout.rightMargin: 5
            visible: showDark
            spacing: 5
            FluText {
                text: darkText
                color: root.textColor
            }
            FluToggleSwitch {
                id: btn_dark
                checked: FluTheme.dark
                clickListener: () => darkClickListener(btn_dark)
            }
        }
        FluIconButton {
            id: btn_minimize
            width: 40
            height: 30
            iconSource: FluentIcons.ChromeMinimize
            Layout.alignment: Qt.AlignTop
            iconSize: 11
            text: minimizeText
            radius: 0
            visible: !isMac
            iconColor: root.textColor
            color: hovered ? minimizeHoverColor : minimizeNormalColor
            onClicked: minClickListener()
        }
        FluIconButton {
            id: btn_maximize
            width: 40
            height: 30
            iconSource: d.isRestore ? FluentIcons.ChromeRestore : FluentIcons.ChromeMaximize
            color: hovered ? maximizeHoverColor : maximizeNormalColor
            Layout.alignment: Qt.AlignTop
            visible: d.resizable && !isMac
            radius: 0
            iconColor: root.textColor
            text: d.isRestore ? restoreText : maximizeText
            iconSize: 11
            onClicked: maxClickListener()
        }
        FluIconButton {
            id: btn_close
            iconSource: FluentIcons.ChromeClose
            Layout.alignment: Qt.AlignTop
            text: closeText
            width: 40
            height: 30
            visible: !isMac
            radius: 0
            iconSize: 10
            iconColor: hovered ? Qt.rgba(1, 1, 1, 1) : root.textColor
            color: hovered ? closeHoverColor : closeNormalColor
            onClicked: closeClickListener()
        }
    }

    function minimizeButton() {
        return btn_minimize
    }

    function maximizeButton() {
        return btn_maximize
    }

    function closeButton() {
        return btn_close
    }

    function setHitTestVisibleItems(frameless_helper) {
        frameless_helper.setHitTestVisible(btn_minimize)
        frameless_helper.setHitTestVisible(btn_maximize)
        frameless_helper.setHitTestVisible(btn_close)
        frameless_helper.setHitTestVisible(btn_transfer)
    }
}