import QtQuick 2.15 import QtQuick.Controls 2.15 import QtQuick.Layouts 1.15 import StatusQ.Core 0.1 import StatusQ.Core.Theme 0.1 import StatusQ.Components 0.1 import utils 1.0 Item { id: root enum Type { Danger, Warning, Success } property bool active: false property int type: ModuleWarning.Danger property int progressValue: -1 // 0..100, -1 not visible property string text: "" property alias buttonText: button.text property alias closeBtnVisible: closeImg.visible property string iconName property bool delay: true signal clicked() signal closeClicked() signal showStarted() signal showFinished() signal hideStarted() signal hideFinished() function show() { hideTimer.stop() active = true; } function showFor(duration = 5000) { show(); hide(duration); } function hide(timeout = 0) { hideTimer.interval = timeout hideTimer.start() } function close() { root.closeClicked() } signal linkActivated(string link) onActiveChanged: { if (root.active && root.delay) { showTimer.start(); } } NumberAnimation { id: showAnimation target: root running: (root.active && !root.delay) property: "implicitHeight" from: 0 to: 32 duration: 500 easing.type: Easing.OutCubic onStarted: { root.visible = true; root.showStarted() } onFinished: { root.showFinished() } } NumberAnimation { id: hideAnimation running: !root.active target: root property: "implicitHeight" from: 32 to: 0 duration: 500 easing.type: Easing.OutCubic onStarted: { root.hideStarted() root.visible = false; } onFinished: { root.hideFinished() } } Timer { id: showTimer interval: 3000 onTriggered: { if (root.active) { showAnimation.start(); } } } Timer { id: hideTimer repeat: false running: false onTriggered: { root.active = false } } Rectangle { id: content anchors.fill: parent readonly property color baseColor: { switch (root.type) { case ModuleWarning.Danger: return Theme.palette.dangerColor1 case ModuleWarning.Success: return Theme.palette.successColor1 case ModuleWarning.Warning: return Theme.palette.warningColor1 default: return Theme.palette.baseColor1 } } color: baseColor Behavior on color { ColorAnimation { duration: 150 } } RowLayout { id: layout spacing: 12 anchors.centerIn: parent StatusRoundIcon { Layout.preferredHeight: 16 Layout.preferredWidth: 16 Layout.rightMargin: -8 visible: !!root.iconName asset.name: root.iconName asset.bgColor: Theme.palette.indirectColor1 asset.color: content.baseColor } StatusBaseText { text: root.text font.pixelSize: 13 font.weight: Font.Medium color: Theme.palette.indirectColor1 linkColor: color onLinkActivated: root.linkActivated(link) HoverHandler { id: handler1 } MouseArea { anchors.fill: parent acceptedButtons: Qt.NoButton cursorShape: handler1.hovered && parent.hoveredLink ? Qt.PointingHandCursor : Qt.ArrowCursor } } Button { id: button visible: text != "" focusPolicy: Qt.NoFocus padding: 5 onClicked: { root.clicked() } contentItem: StatusBaseText { text: button.text font.pixelSize: 13 font.weight: Font.Medium font.family: Theme.baseFont.name horizontalAlignment: Text.AlignHCenter verticalAlignment: Text.AlignVCenter color: Theme.palette.indirectColor1 } background: Rectangle { radius: 4 border.width: 1 border.color: Theme.palette.indirectColor3 color: Theme.palette.getColor("white", button.hovered ? 0.4 : 0.1) } MouseArea { anchors.fill: parent acceptedButtons: Qt.NoButton cursorShape: Qt.PointingHandCursor } } } StatusBaseText { anchors.verticalCenter: parent.verticalCenter anchors.right: progressBar.left anchors.rightMargin: Theme.halfPadding text: qsTr("%1%").arg(progressBar.value) visible: progressBar.visible font.pixelSize: 12 verticalAlignment: Text.AlignVCenter color: Theme.palette.white } ProgressBar { id: progressBar anchors.verticalCenter: parent.verticalCenter anchors.right: closeImg.left anchors.rightMargin: Theme.bigPadding from: 0 to: 100 visible: root.progressValue > -1 value: root.progressValue background: Rectangle { implicitWidth: 64 implicitHeight: 8 radius: 8 color: "transparent" border.width: 1 border.color: Theme.palette.white } contentItem: Rectangle { width: progressBar.width*progressBar.position implicitHeight: 8 radius: 8 color: Theme.palette.white } } StatusIcon { id: closeImg anchors.verticalCenter: parent.verticalCenter anchors.right: parent.right anchors.rightMargin: 18 height: 20 width: 20 icon: "close-circle" color: Theme.palette.indirectColor1 opacity: closeButtonMouseArea.containsMouse ? 1 : 0.7 MouseArea { id: closeButtonMouseArea anchors.fill: parent hoverEnabled: true cursorShape: Qt.PointingHandCursor onClicked: { root.closeClicked() } } } } }