status-desktop/ui/app/AppLayouts/Profile/views/SettingsContentBase.qml

153 lines
4.2 KiB
QML
Raw Normal View History

import QtQuick 2.13
import QtQuick.Controls 2.3
import QtQuick.Layouts 1.13
import utils 1.0
2022-06-22 12:16:21 +00:00
import shared.popups 1.0
import StatusQ.Core 0.1
import StatusQ.Controls 0.1
import StatusQ.Core.Theme 0.1
Item {
id: root
property string sectionTitle
property int contentWidth
readonly property int contentHeight: (root.height - d.topHeaderHeight - d.titleRowHeight)
property string backButtonName: ""
property alias titleRowComponentLoader: loader
property list<Item> headerComponents
default property Item content
2022-06-22 12:16:21 +00:00
property bool dirty: false
property bool saveChangesButtonEnabled: false
signal backButtonClicked()
signal baseAreaClicked()
2022-06-22 12:16:21 +00:00
signal saveChangesClicked()
signal resetChangesClicked()
function notifyDirty() {
settingsDirtyToastMessage.notifyDirty();
}
QtObject {
id: d
readonly property int topHeaderHeight: 56
readonly property int titleRowHeight: 56
}
MouseArea {
anchors.fill: parent
onClicked: { root.baseAreaClicked() }
}
Component.onCompleted: {
content.parent = contentWrapper
if (headerComponents.length) {
for (let i in headerComponents) {
headerComponents[i].parent = titleRow
}
}
}
Item {
id: topHeader
anchors.left: parent.left
anchors.top: parent.top
anchors.leftMargin: -Style.current.padding
width: root.contentWidth + Style.current.padding
height: d.topHeaderHeight
StatusFlatButton {
anchors.top: parent.top
anchors.left: parent.left
anchors.topMargin: Style.current.halfPadding
visible: root.backButtonName != ""
icon.name: "arrow-left"
icon.width: 20
icon.height: 20
text: root.backButtonName
size: StatusBaseButton.Size.Large
onClicked: root.backButtonClicked()
}
}
RowLayout {
id: titleRow
anchors.left: parent.left
anchors.top: topHeader.bottom
anchors.leftMargin: Style.current.padding
width: root.contentWidth - Style.current.padding
height: d.titleRowHeight
visible: root.sectionTitle !== ""
StatusBaseText {
Layout.fillWidth: true
text: root.sectionTitle
font.weight: Font.Bold
font.pixelSize: Constants.settingsSection.mainHeaderFontSize
color: Theme.palette.directColor1
}
Loader {
id: loader
}
}
StatusScrollView {
2022-06-22 12:16:21 +00:00
id: scrollView
objectName: "settingsContentBaseScrollView"
2022-06-22 12:16:21 +00:00
anchors.top: titleRow.visible ? titleRow.bottom : topHeader.bottom
anchors.bottom: parent.bottom
anchors.left: parent.left
anchors.topMargin: Style.current.bigPadding
padding: 0
2022-06-22 12:16:21 +00:00
width: root.contentWidth
Column {
id: contentLayout
width: scrollView.availableWidth
MouseArea {
onClicked: root.baseAreaClicked()
width: contentWrapper.implicitWidth
height: contentWrapper.implicitHeight
2022-06-22 12:16:21 +00:00
Column {
id: contentWrapper
2022-06-22 12:16:21 +00:00
}
}
2022-06-22 12:16:21 +00:00
Item {
// This is a settingsDirtyToastMessage placeholder
width: settingsDirtyToastMessage.implicitWidth
height: settingsDirtyToastMessage.active ? settingsDirtyToastMessage.implicitHeight : 0
2022-06-22 12:16:21 +00:00
Behavior on implicitHeight {
NumberAnimation {
duration: 150
easing.type: Easing.InOutQuad
2022-06-22 12:16:21 +00:00
}
}
}
}
}
2022-06-22 12:16:21 +00:00
SettingsDirtyToastMessage {
id: settingsDirtyToastMessage
anchors.bottom: scrollView.bottom
anchors.horizontalCenter: scrollView.horizontalCenter
active: root.dirty
flickable: scrollView
2022-06-22 12:16:21 +00:00
saveChangesButtonEnabled: root.saveChangesButtonEnabled
onResetChangesClicked: root.resetChangesClicked()
onSaveChangesClicked: root.saveChangesClicked()
}
}