Load `TaskBriefForm.ui.qml` inside `TaskDetailForm.ui.qml`

2 files changed, 91 insertions, 117 deletions

diff --git a/features/TaskBriefForm.ui.qml b/features/TaskBriefForm.ui.qml
new file mode 100644
index 0000000..e9e2587
--- /dev/null
+++ b/features/TaskBriefForm.ui.qml
@@ -0,0 +1,79 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.12
+import QtQuick.Controls.Material 2.12
+import QtQuick.Layouts 1.12
+
+Page {
+    id: page
+    RowLayout {
+        id: ticketSubjectLayout
+        height: ticketSubject.height + 32
+        anchors.right: parent.right
+        anchors.rightMargin: 0
+        anchors.left: parent.left
+        anchors.leftMargin: 0
+        spacing: 8
+        Label {
+            id: ticketSubject
+            text: qsTr("Ticket subject")
+            Layout.rightMargin: 16
+            Layout.fillWidth: true
+            Layout.leftMargin: 16
+            font.weight: Font.Medium
+            font.family: "Work Sans"
+            font.pixelSize: 20
+        }
+    }
+    RowLayout {
+        id: ticketMetaLayout
+        anchors.top: ticketSubjectLayout.bottom
+        anchors.topMargin: 0
+        height: userAvatar.height + 16
+        anchors.right: parent.right
+        anchors.rightMargin: 0
+        anchors.left: parent.left
+        anchors.leftMargin: 0
+        spacing: 8
+        Rectangle {
+            id: userAvatar
+            height: 24
+            width: 24
+            radius: 8
+            Layout.leftMargin: 16
+            Image {
+                anchors.fill: parent
+                source: "https://via.placeholder.com/32x32.png"
+                fillMode: Image.PreserveAspectFit
+            }
+        }
+
+        Text {
+            id: ticketCreator
+            text: qsTr("Username")
+            font.weight: Font.Medium
+            width: ticketCreator.width
+            font.family: "Work Sans"
+            verticalAlignment: Text.AlignVCenter
+            elide: Text.ElideRight
+            font.pixelSize: 14
+        }
+        Text {
+            id: ticketCreatedText
+            text: qsTr("created this issue")
+            width: ticketCreatedText.width
+        }
+        Text {
+            id: ticketCreated
+            text: qsTr("2017-07-25 14:05:30")
+            Layout.rightMargin: 16
+            width: ticketCreated.width
+        }
+    }
+}
+
+/*##^##
+Designer {
+    D{i:0;autoSize:true;height:480;width:640}
+}
+##^##*/
+
diff --git a/features/TaskDetailForm.ui.qml b/features/TaskDetailForm.ui.qml
index 3c81052..8b742ee 100644
--- a/features/TaskDetailForm.ui.qml
+++ b/features/TaskDetailForm.ui.qml
@@ -10,8 +10,6 @@ Page {
         color: "#FFFFFF"
     }
 
-    property alias taskTitle: taskTitle
-    property alias taskDescription: taskDescription
     property alias backButton: backButton
 
     header: ToolBar {
@@ -37,128 +35,25 @@ Page {
             }
         }
     }
+    StackView {
+        id: contentView
+        anchors.fill: parent
 
-    RowLayout {
-        id: taskTitleLayout
-        height: taskTitle.height + 16 + 3
-        anchors.top: parent.top
-        anchors.topMargin: 0
-        anchors.right: parent.right
-        anchors.rightMargin: 0
-        anchors.left: parent.left
-        anchors.leftMargin: 0
-        Layout.fillWidth: true
-
-        TextField {
-            id: taskTitle
-            Layout.rightMargin: 16
-            Layout.leftMargin: 66
-            Layout.fillWidth: true
-            placeholderText: qsTr("Enter task title")
-            font.pixelSize: 16
-            font.family: "Google Sans"
-            wrapMode: Text.WrapAtWordBoundaryOrAnywhere
-        }
-    }
-    RowLayout {
-        id: taskDescriptionLayout
-        width: parent.width
-        height: taskDescription.height + 16 + 3
-        anchors.horizontalCenter: parent.horizontalCenter
-        anchors.top: taskTitleLayout.bottom
-        anchors.topMargin: 24
-        Image {
-            id: descriptionIcon
-            Layout.topMargin: 20
-            Layout.alignment: Qt.AlignLeft | Qt.AlignTop
-            sourceSize.height: 24
-            sourceSize.width: 24
-            Layout.leftMargin: 12
-            opacity: 0.54
-            Layout.minimumHeight: 24
-            Layout.minimumWidth: 24
-            Layout.preferredHeight: 24
-            Layout.preferredWidth: 24
-            source: "/components/icons/notes-24px.svg"
-        }
-        TextField {
-            id: taskDescription
-            font.family: "Google Sans"
-            font.pixelSize: 16
-            Layout.rightMargin: 16
-            Layout.leftMargin: 24
-            Layout.fillWidth: true
-            placeholderText: qsTr("Enter task description")
-            wrapMode: Text.WrapAtWordBoundaryOrAnywhere
-        }
-    }
-    RowLayout {
-        id: attachmentLayout
-        height: 56
-        anchors.right: parent.right
-        anchors.rightMargin: 0
-        anchors.left: parent.left
-        anchors.leftMargin: 0
-        anchors.top: taskDescriptionLayout.bottom
-        anchors.topMargin: 24
-        Image {
-            id: attachmentIcon
-            sourceSize.height: 24
-            sourceSize.width: 24
-            Layout.leftMargin: 12
-            opacity: 0.54
-            Layout.minimumHeight: 24
-            Layout.minimumWidth: 24
-            Layout.preferredHeight: 24
-            Layout.preferredWidth: 24
-            source: "/components/icons/attachment-24px.svg"
-        }
-        Label {
-            color: "#000000"
-            text: qsTr("Attachment")
-            font.weight: Font.Medium
-            font.pixelSize: 16
-            font.family: "Work Sans"
-            verticalAlignment: Text.AlignVCenter
-            Layout.leftMargin: 24
-            Layout.fillWidth: true
-        }
-    }
-    RowLayout {
-        id: attachmentItemLayout
-        height: attachmentItem.height + 16
-        anchors.leftMargin: 0
-        anchors.top: attachmentLayout.bottom
-        anchors.topMargin: 0
-        anchors.right: parent.right
-        anchors.rightMargin: 0
-        anchors.left: parent.left
-        ItemDelegate {
-            id: attachmentItem
-            height: 56
-            text: qsTr("Attached-file-name.file-format")
-            rightPadding: 16
-            leftPadding: 161
-            bottomPadding: 16
-            topPadding: 16
-            highlighted: false
-            font.weight: Font.Medium
-            font.pixelSize: 14
-            font.family: "Work Sans"
-            Layout.rightMargin: 16
-            Layout.leftMargin: 66
-            Layout.fillWidth: true
-            background: Rectangle {
-                color: "#D6C3F8"
-                radius: 8
-            }
+        TaskBriefForm {
+            id: taskBriefForm
+            anchors.top: parent.top
+            anchors.topMargin: 0
+            anchors.right: parent.right
+            anchors.rightMargin: 0
+            anchors.left: parent.left
+            anchors.leftMargin: 0
         }
     }
 }
 
 /*##^##
 Designer {
-    D{i:0;autoSize:true;height:480;width:640}
+    D{i:0;autoSize:true;height:480;width:640}D{i:8;anchors_x:43;anchors_y:73}
 }
 ##^##*/