From 702883b44af70bb04785e65a38b143f1b6062582 Mon Sep 17 00:00:00 2001 From: Marius Kittler Date: Tue, 20 Nov 2018 18:09:04 +0100 Subject: [PATCH] Quick GUI: Edit field in separate dialog Editing tables is just not so nice on mobile devices --- qml/FieldsPage.qml | 212 ++++++++++++++++++++++++++++++++++----------- 1 file changed, 161 insertions(+), 51 deletions(-) diff --git a/qml/FieldsPage.qml b/qml/FieldsPage.qml index e561295..e26285c 100644 --- a/qml/FieldsPage.qml +++ b/qml/FieldsPage.qml @@ -14,13 +14,73 @@ Kirigami.ScrollablePage { color: Kirigami.Theme.backgroundColor } + // dialog to edit certain field + BasicDialog { + id: fieldDialog + property int entryIndex: -1 + property alias fieldName: fieldNameEdit.text + property alias fieldValue: fieldValueEdit.text + property alias isPassword: fieldIsPasswordCheckBox.checked + title: qsTr("Edit field of ") + nativeInterface.currentAccountName + standardButtons: Controls.Dialog.Ok | Controls.Dialog.Cancel + onAccepted: { + var column0 = fieldsListView.model.index(entryIndex, 0) + var column1 = fieldsListView.model.index(entryIndex, 1) + fieldsListView.model.setData(column0, fieldName) + fieldsListView.model.setData(column1, fieldValue) + fieldsListView.model.setData(column0, isPassword ? 1 : 0, + 0x0100 + 1) + } + + ColumnLayout { + Controls.TextField { + id: fieldNameEdit + Layout.preferredWidth: fieldDialog.availableWidth + text: fieldDialog.fieldName + Keys.onPressed: fieldDialog.acceptOnReturn(event) + } + Controls.TextField { + id: fieldValueEdit + Layout.preferredWidth: fieldDialog.availableWidth + text: fieldDialog.fieldValue + echoMode: fieldDialog.isPassword + && !showCharactersCheckBox.checked ? TextInput.PasswordEchoOnEdit : TextInput.Normal + Keys.onPressed: fieldDialog.acceptOnReturn(event) + } + RowLayout { + Layout.preferredWidth: fieldDialog.availableWidth + Controls.CheckBox { + id: fieldIsPasswordCheckBox + text: qsTr("Mark as password") + checked: false + } + Controls.CheckBox { + id: showCharactersCheckBox + text: qsTr("Show characters") + checked: false + visible: fieldDialog.isPassword + } + } + } + + function init(model, index) { + entryIndex = index + fieldName = model.key ? model.key : "" + fieldValue = model.actualValue ? model.actualValue : "" + isPassword = model.isPassword ? true : false + } + } + // component representing a field Component { id: fieldsListDelegateComponent - Kirigami.BasicListItem { + Kirigami.SwipeListItem { id: fieldsListItem contentItem: RowLayout { + id: fieldRow + property bool isLastRow: model.isPassword === undefined + Kirigami.ListItemDragHandle { listItem: fieldsListItem listView: fieldsListView @@ -29,67 +89,117 @@ Kirigami.ScrollablePage { oldIndex, 1, fieldsListView.model.index(-1, 0), newIndex) + opacity: fieldRow.isLastRow ? 0 : 100 } - Controls.TextField { + Item { Layout.fillWidth: true - text: model.key ? model.key : "" - onEditingFinished: fieldsListView.model.setData( - fieldsListView.model.index(index, - 0), text) - } - Controls.TextField { - Layout.fillWidth: true - text: model.actualValue ? model.actualValue : "" - echoMode: model.isPassword - && (!activeFocus - || !main.showPasswordsOnFocus) ? TextInput.PasswordEchoOnEdit : TextInput.Normal - onEditingFinished: fieldsListView.model.setData( - fieldsListView.model.index(index, - 1), text) - } - Kirigami.Icon { - source: "handle-left" - width: Kirigami.Units.iconSizes.smallMedium - height: Kirigami.Units.iconSizes.smallMedium Layout.fillHeight: true + RowLayout { + anchors.fill: parent + Controls.Label { + Layout.fillWidth: true + Layout.fillHeight: true + text: { + if (fieldRow.isLastRow) { + return "click to add new field" + } + + var pieces = [] + if (model.key) { + pieces.push(model.key) + } + if (model.value) { + pieces.push(model.value) + } + return pieces.join(": ") + } + color: fieldRow.isLastRow ? "gray" : palette.text + } + } MouseArea { anchors.fill: parent acceptedButtons: Qt.LeftButton | Qt.RightButton - onClicked: fieldContextMenu.popup() + onClicked: { + if (mouse.button === Qt.RightButton) { + fieldContextMenu.popup() + return + } + fieldDialog.init(model, index) + fieldDialog.open() + } onPressAndHold: fieldContextMenu.popup() } - } - Controls.Menu { - id: fieldContextMenu - Controls.MenuItem { - icon.name: model.isPassword ? "password-show-off" : "password-show-on" - text: model.isPassword ? qsTr("Mark as normal field") : qsTr( - "Mark as password field") - onClicked: fieldsListView.model.setData( - fieldsListView.model.index(index, 0), - model.isPassword ? 0 : 1, 0x0100 + 1) - } - Controls.MenuItem { - icon.name: "edit-copy" - text: model.isPassword ? qsTr("Copy password") : qsTr( - "Copy value") - onClicked: showPassiveNotification( - nativeInterface.copyToClipboard( - model.actualValue) ? qsTr("Copied") : qsTr( - "Unable to access clipboard")) - } - Controls.MenuItem { - icon.name: "edit-delete" - text: qsTr("Delete field") - onClicked: fieldsListView.model.removeRows(index, 1) - } - Controls.MenuItem { - icon.name: "list-add" - text: qsTr("Insert empty field after this") - onClicked: fieldsListView.model.insertRows(index + 1, 1) + Controls.Menu { + id: fieldContextMenu + Controls.MenuItem { + icon.name: model.isPassword ? "password-show-off" : "password-show-on" + text: model.isPassword ? qsTr("Mark as normal field") : qsTr( + "Mark as password field") + onClicked: fieldsListView.model.setData( + fieldsListView.model.index(index, + 0), + model.isPassword ? 0 : 1, 0x0100 + 1) + } + Controls.MenuItem { + icon.name: "edit-copy" + text: model.isPassword ? qsTr("Copy password") : qsTr( + "Copy value") + onClicked: showPassiveNotification( + nativeInterface.copyToClipboard( + model.actualValue) ? qsTr("Copied") : qsTr( + "Unable to access clipboard")) + } + Controls.MenuItem { + icon.name: "edit-delete" + text: qsTr("Delete field") + onClicked: fieldsListView.model.removeRows(index, 1) + } + Controls.MenuItem { + icon.name: "list-add" + text: qsTr("Insert empty field after this") + onClicked: fieldsListView.model.insertRows( + index + 1, 1) + } } } } + actions: [ + Kirigami.Action { + iconName: model.isPassword ? "password-show-off" : "password-show-on" + text: model.isPassword ? qsTr( + "Mark as normal field") : qsTr( + "Mark as password field") + onTriggered: fieldsListView.model.setData( + fieldsListView.model.index(index, 0), + model.isPassword ? 0 : 1, 0x0100 + 1) + visible: !fieldRow.isLastRow + }, + Kirigami.Action { + iconName: "edit-copy" + text: model.isPassword ? qsTr("Copy password") : qsTr( + "Copy value") + onTriggered: showPassiveNotification( + nativeInterface.copyToClipboard( + model.actualValue) ? qsTr("Copied") : qsTr( + "Unable to access clipboard")) + shortcut: StandardKey.Cut + visible: !fieldRow.isLastRow + }, + Kirigami.Action { + iconName: "edit-delete" + text: qsTr("Delete field") + onTriggered: fieldsListView.model.removeRows(index, 1) + shortcut: StandardKey.Delete + visible: !fieldRow.isLastRow + }, + Kirigami.Action { + iconName: "list-add" + text: qsTr("Insert empty field after this") + enabled: !nativeInterface.hasEntryFilter + onTriggered: fieldsListView.model.insertRows(index + 1, 1) + visible: !fieldRow.isLastRow + } + ] } }