Add account settings page

Display name change working
This commit is contained in:
miruka
2019-07-13 20:15:20 -04:00
parent eeea0af4cd
commit 751a27157c
27 changed files with 435 additions and 162 deletions

View File

@@ -7,9 +7,6 @@ import QtQuick.Layouts 1.12
import "../../Base"
import "../../utils.js" as Utils
HRectangle {
HLabel {
anchors.centerIn: parent
text: "Client - TODO"
}
HLabel {
text: "Client - TODO"
}

View File

@@ -7,9 +7,6 @@ import QtQuick.Layouts 1.12
import "../../Base"
import "../../utils.js" as Utils
HRectangle {
HLabel {
anchors.centerIn: parent
text: "Devices - TODO"
}
HLabel {
text: "Devices - TODO"
}

View File

@@ -7,66 +7,75 @@ import QtQuick.Layouts 1.12
import "../../Base"
import "../../utils.js" as Utils
HRectangle {
Page {
id: editAccount
padding: currentSpacing < 8 ? 0 : currentSpacing
Behavior on padding { HNumberAnimation {} }
property bool wide: width > 414 + padding * 2
property int thinMaxWidth: 240
property int normalSpacing: 8
property int currentSpacing:
Math.min(normalSpacing * width / 400, normalSpacing * 2)
property string userId: ""
readonly property var userInfo: users.find(userId)
HColumnLayout {
anchors.fill: parent
header: HRectangle {
width: parent.width
height: theme.bottomElementsHeight
color: theme.pageHeadersBackground
HRowLayout {
Layout.preferredHeight: theme.bottomElementsHeight
width: parent.width
HLabel {
text: qsTr("Edit %1").arg(
text: qsTr("Account settings for %1").arg(
Utils.coloredNameHtml(userInfo.displayName, userId)
)
textFormat: Text.StyledText
font.pixelSize: theme.fontSize.big
elide: Text.ElideRight
maximumLineCount: 1
// visible: width > 50
Layout.fillWidth: true
Layout.maximumWidth: parent.width - tabBar.width
Layout.leftMargin: 8
Layout.leftMargin: currentSpacing
Layout.rightMargin: Layout.leftMargin
Layout.fillWidth: true
}
TabBar {
id: tabBar
currentIndex: swipeView.currentIndex
spacing: 0
contentHeight: parent.height
TabButton {
text: qsTr("Profile")
width: implicitWidth * 1.25
}
TabButton {
text: qsTr("Devices")
width: implicitWidth * 1.25
}
TabButton {
text: qsTr("Harmony")
width: implicitWidth * 1.25
}
}
}
SwipeView {
id: swipeView
clip: true
currentIndex: tabBar.currentIndex
Layout.fillHeight: true
Layout.fillWidth: true
Profile {}
Devices {}
ClientSettings {}
}
}
background: null
HColumnLayout {
anchors.fill: parent
spacing: 16
HRectangle {
color: theme.box.background
// radius: theme.box.radius
Layout.alignment: Qt.AlignCenter
Layout.preferredWidth: wide ? parent.width : thinMaxWidth
Layout.maximumWidth: Math.min(parent.width, 640)
Layout.preferredHeight: childrenRect.height
Layout.maximumHeight: parent.height
Profile { width: parent.width }
}
// HRectangle {
// color: theme.box.background
// radius: theme.box.radius
// ClientSettings { width: parent.width }
// }
// HRectangle {
// color: theme.box.background
// radius: theme.box.radius
// Devices { width: parent.width }
// }
}
}

View File

@@ -7,9 +7,93 @@ import QtQuick.Layouts 1.12
import "../../Base"
import "../../utils.js" as Utils
HRectangle {
HLabel {
anchors.centerIn: parent
text: "profile"
HGridLayout {
function applyChanges() {
saveButton.loading = true
py.callClientCoro(
userId, "set_displayname", [nameField.field.text],
() => { saveButton.loading = false }
)
}
columns: 2
flow: wide ? GridLayout.LeftToRight : GridLayout.TopToBottom
rowSpacing: currentSpacing
Component.onCompleted: nameField.field.forceActiveFocus()
HUserAvatar {
id: avatar
userId: editAccount.userId
toolTipImageUrl: null
Layout.alignment: Qt.AlignHCenter
Layout.topMargin: wide ? 0 : currentSpacing
Layout.preferredWidth: thinMaxWidth
Layout.preferredHeight: Layout.preferredWidth
}
HColumnLayout {
id: profileInfo
spacing: normalSpacing
HColumnLayout {
spacing: normalSpacing
Layout.margins: currentSpacing
HLabel {
text: qsTr("User ID:<br>%1")
.arg(Utils.coloredNameHtml(userId, userId))
textFormat: Text.StyledText
wrapMode: Text.Wrap
Layout.fillWidth: true
}
HLabeledTextField {
id: nameField
label.text: qsTr("Display name:")
field.text: userInfo.displayName
field.onAccepted: applyChanges()
Layout.fillWidth: true
Layout.maximumWidth: 480
}
}
HSpacer {}
HRowLayout {
Layout.alignment: Qt.AlignBottom
HUIButton {
id: saveButton
iconName: "save"
text: qsTr("Save")
centerText: false
enabled: nameField.field.text != userInfo.displayName
Layout.fillWidth: true
Layout.alignment: Qt.AlignBottom
onClicked: applyChanges()
}
HUIButton {
iconName: "cancel"
text: qsTr("Cancel")
centerText: false
Layout.fillWidth: true
Layout.alignment: Qt.AlignBottom
enabled: saveButton.enabled && ! saveButton.loading
onClicked: {
nameField.field.text = userInfo.displayName
}
}
}
}
}