From 9d6f6d25c87eb89563c1b1015eba2902d9854d04 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=A6=8C=EA=A6=AB=EA=A6=B6=EA=A6=8F=EA=A7=80=EA=A6=A6?= =?UTF-8?q?=EA=A6=BF=EA=A6=A7=EA=A6=AE=EA=A6=91=EA=A6=A9=EA=A6=AD=EA=A7=80?= Date: Sun, 2 Apr 2023 11:44:14 +0800 Subject: Separate personal info from checkout to its own file --- Shop/Checkout/PersonalInfo.ui.qml | 329 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 329 insertions(+) create mode 100644 Shop/Checkout/PersonalInfo.ui.qml (limited to 'Shop/Checkout/PersonalInfo.ui.qml') diff --git a/Shop/Checkout/PersonalInfo.ui.qml b/Shop/Checkout/PersonalInfo.ui.qml new file mode 100644 index 0000000..b35878c --- /dev/null +++ b/Shop/Checkout/PersonalInfo.ui.qml @@ -0,0 +1,329 @@ +import QtQuick 2.15 +import QtQuick.Controls 2.15 +import QtQuick.Layouts 1.15 +import Eduport 1.4 +import "../../TextField" +import "../../Label" + +ColumnLayout { + property alias name: name + property alias email: email + property alias mobile: mobile + property alias country: country + property alias state: province + property alias postal: postal + property alias address: address + property alias banks: banks + + anchors { + left: parent.left + right: parent.right + } + + H5 { + text: qsTr("Personal Details") + Layout.fillWidth: true + Layout.rightMargin: 16 + Layout.leftMargin: 16 + Layout.topMargin: 16 + } + + GridLayout { + Layout.margins: 16 + columns: body.width < 768 ? 1 : 2 + rows: body.width < 768 ? 4 : 7 + columnSpacing: 0 + rowSpacing: 16 + + ColumnLayout { + + Body { + text: qsTr("Your name *") + Layout.fillWidth: true + } + + Rectangle { + implicitHeight: 56 + color: "#f5f7f9" + radius: 8 + border.width: 0 + Layout.fillWidth: true + RowLayout { + anchors.fill: parent + Input { + id: name + placeholderText: qsTr("Name") + Layout.fillWidth: true + Layout.fillHeight: true + } + } + } + } + + ColumnLayout { + + Body { + text: qsTr("Email address *") + Layout.fillWidth: true + } + + Rectangle { + implicitHeight: 56 + color: "#f5f7f9" + radius: 8 + border.width: 0 + Layout.fillWidth: true + RowLayout { + anchors.fill: parent + Input { + id: email + placeholderText: qsTr("Email") + Layout.fillWidth: true + Layout.fillHeight: true + } + } + } + } + + ColumnLayout { + + Body { + text: qsTr("Mobile number *") + Layout.fillWidth: true + } + + Rectangle { + implicitHeight: 56 + color: "#f5f7f9" + radius: 8 + border.width: 0 + Layout.fillWidth: true + RowLayout { + anchors.fill: parent + Input { + id: mobile + placeholderText: + qsTr("Mobile number") + Layout.fillWidth: true + Layout.fillHeight: true + } + } + } + } + + ColumnLayout { + + Body { + text: qsTr("Select country *") + Layout.fillWidth: true + } + Rectangle { + implicitHeight: 56 + color: "#f5f7f9" + radius: 8 + border.width: 0 + Layout.fillWidth: true + RowLayout { + anchors.fill: parent + Input { + id: country + placeholderText: + qsTr("Select country") + Layout.fillWidth: true + Layout.fillHeight: true + } + } + } + } + + ColumnLayout { + + Body { + text: qsTr("Select state *") + Layout.fillWidth: true + } + + Rectangle { + implicitHeight: 56 + color: "#f5f7f9" + radius: 8 + border.width: 0 + Layout.fillWidth: true + RowLayout { + anchors.fill: parent + Input { + id: province + placeholderText: + qsTr("Select state") + Layout.fillWidth: true + Layout.fillHeight: true + } + } + } + } + + ColumnLayout { + + Body { + text: qsTr("Postal code *") + Layout.fillWidth: true + } + + Rectangle { + implicitHeight: 56 + color: "#f5f7f9" + radius: 8 + border.width: 0 + Layout.fillWidth: true + RowLayout { + anchors.fill: parent + Input { + id: postal + placeholderText: + qsTr("PIN code") + Layout.fillWidth: true + Layout.fillHeight: true + } + } + } + } + + ColumnLayout { + + Body { + text: qsTr("Address *") + Layout.fillWidth: true + } + + Rectangle { + implicitHeight: 56 + color: "#f5f7f9" + radius: 8 + border.width: 0 + Layout.fillWidth: true + RowLayout { + anchors.fill: parent + Input { + id: address + placeholderText: qsTr("Address") + Layout.fillWidth: true + Layout.fillHeight: true + } + } + } + } + } + + ColumnLayout { + + H5 { + text: qsTr("Payment method") + Layout.fillWidth: true + Layout.margins: 16 + } + + ColumnLayout { + + Rectangle { + implicitHeight: paymentCard.height + Layout.margins: 16 + Layout.fillWidth: true + border.width: 1 + radius: 8 + border.color: "#4d000000" + + ColumnLayout { + id: paymentCard + anchors { + left: parent.left + right: parent.right + } + Body { + text: + qsTr("Credit or Debit Card") + Layout.fillWidth: true + padding: 16 + } + } + } + + Rectangle { + implicitHeight: paymentNetBanking.height + Layout.margins: 16 + Layout.fillWidth: true + border.width: 1 + radius: 8 + border.color: "#4d000000" + + ColumnLayout { + id: paymentNetBanking + anchors { + left: parent.left + right: parent.right + } + + Body { + text: + qsTr("Pay with Net Banking") + Layout.fillWidth: true + Layout.rightMargin: 16 + Layout.leftMargin: 16 + Layout.topMargin: 16 + } + + ColumnLayout { + Layout.margins: 16 + Body { + text: qsTr("In order to complete your transaction, we will transfer you over to Eduport secure servers.") + Layout.fillWidth: true + } + + Body { + text: qsTr("Select your bank from the drop-down list and click proceed to continue with your payment.") + Layout.fillWidth: true + } + + ComboBox { + id: banks + Layout.fillWidth: true + font.pointSize: 14 + font.family: "roboto" + Layout.topMargin: 24 + model: ListModel { + ListElement { + label: "Please choose one" + } + ListElement { + label: "Bank of America" + } + ListElement { + label: "Bank of India" + } + ListElement { + label: "Bank of London" + } + } + delegate: ItemDelegate { + contentItem: Text { + text: label + font { + family: Eduport.bodyFont.family + weight: Eduport.bodyFont.weight + pointSize: Eduport.bodyFont.pointSize + } + } + } + background: Rectangle { + radius: 8 + implicitHeight: 36 + implicitWidth: 200 + color: "#f5f7f9" + } + } + } + } + } + } + } +} + -- cgit v1.2.3 From d69434998b2c73fa82d779ec08b585239d474ed5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=A6=8C=EA=A6=AB=EA=A6=B6=EA=A6=8F=EA=A7=80=EA=A6=A6?= =?UTF-8?q?=EA=A6=BF=EA=A6=A7=EA=A6=AE=EA=A6=91=EA=A6=A9=EA=A6=AD=EA=A7=80?= Date: Sun, 2 Apr 2023 12:27:20 +0800 Subject: Move personal info anchoring to Checkout --- Shop/Checkout/PersonalInfo.ui.qml | 5 ----- 1 file changed, 5 deletions(-) (limited to 'Shop/Checkout/PersonalInfo.ui.qml') diff --git a/Shop/Checkout/PersonalInfo.ui.qml b/Shop/Checkout/PersonalInfo.ui.qml index b35878c..77b4698 100644 --- a/Shop/Checkout/PersonalInfo.ui.qml +++ b/Shop/Checkout/PersonalInfo.ui.qml @@ -15,11 +15,6 @@ ColumnLayout { property alias address: address property alias banks: banks - anchors { - left: parent.left - right: parent.right - } - H5 { text: qsTr("Personal Details") Layout.fillWidth: true -- cgit v1.2.3 From b70b1a6dfef5a52df82ab79bce2d2b570951a755 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=A6=8C=EA=A6=AB=EA=A6=B6=EA=A6=8F=EA=A7=80=EA=A6=A6?= =?UTF-8?q?=EA=A6=BF=EA=A6=A7=EA=A6=AE=EA=A6=91=EA=A6=A9=EA=A6=AD=EA=A7=80?= Date: Sun, 2 Apr 2023 12:28:23 +0800 Subject: bsAccordionBg and its use --- Shop/Checkout/PersonalInfo.ui.qml | 2 ++ 1 file changed, 2 insertions(+) (limited to 'Shop/Checkout/PersonalInfo.ui.qml') diff --git a/Shop/Checkout/PersonalInfo.ui.qml b/Shop/Checkout/PersonalInfo.ui.qml index 77b4698..a529ea1 100644 --- a/Shop/Checkout/PersonalInfo.ui.qml +++ b/Shop/Checkout/PersonalInfo.ui.qml @@ -226,6 +226,7 @@ ColumnLayout { border.width: 1 radius: 8 border.color: "#4d000000" + color: Eduport.bsAccordionBg ColumnLayout { id: paymentCard @@ -249,6 +250,7 @@ ColumnLayout { border.width: 1 radius: 8 border.color: "#4d000000" + color: Eduport.bsAccordionBg ColumnLayout { id: paymentNetBanking -- cgit v1.2.3 From c43051ce55cceeb6d51858e6f5edd6041573c503 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=A6=8C=EA=A6=AB=EA=A6=B6=EA=A6=8F=EA=A7=80=EA=A6=A6?= =?UTF-8?q?=EA=A6=BF=EA=A6=A7=EA=A6=AE=EA=A6=91=EA=A6=A9=EA=A6=AD=EA=A7=80?= Date: Sun, 2 Apr 2023 12:45:22 +0800 Subject: Separate NetBanking to its own file --- Shop/Checkout/PersonalInfo.ui.qml | 69 +++------------------------------------ 1 file changed, 5 insertions(+), 64 deletions(-) (limited to 'Shop/Checkout/PersonalInfo.ui.qml') diff --git a/Shop/Checkout/PersonalInfo.ui.qml b/Shop/Checkout/PersonalInfo.ui.qml index a529ea1..3bdff82 100644 --- a/Shop/Checkout/PersonalInfo.ui.qml +++ b/Shop/Checkout/PersonalInfo.ui.qml @@ -4,6 +4,7 @@ import QtQuick.Layouts 1.15 import Eduport 1.4 import "../../TextField" import "../../Label" +import "PersonalInfo/PaymentMethod" ColumnLayout { property alias name: name @@ -13,7 +14,7 @@ ColumnLayout { property alias state: province property alias postal: postal property alias address: address - property alias banks: banks + property alias paymentMethodNetBanking: paymentMethodNetBanking H5 { text: qsTr("Personal Details") @@ -244,7 +245,7 @@ ColumnLayout { } Rectangle { - implicitHeight: paymentNetBanking.height + implicitHeight: paymentMethodNetBanking.height Layout.margins: 16 Layout.fillWidth: true border.width: 1 @@ -252,72 +253,12 @@ ColumnLayout { border.color: "#4d000000" color: Eduport.bsAccordionBg - ColumnLayout { - id: paymentNetBanking + NetBanking { + id: paymentMethodNetBanking anchors { left: parent.left right: parent.right } - - Body { - text: - qsTr("Pay with Net Banking") - Layout.fillWidth: true - Layout.rightMargin: 16 - Layout.leftMargin: 16 - Layout.topMargin: 16 - } - - ColumnLayout { - Layout.margins: 16 - Body { - text: qsTr("In order to complete your transaction, we will transfer you over to Eduport secure servers.") - Layout.fillWidth: true - } - - Body { - text: qsTr("Select your bank from the drop-down list and click proceed to continue with your payment.") - Layout.fillWidth: true - } - - ComboBox { - id: banks - Layout.fillWidth: true - font.pointSize: 14 - font.family: "roboto" - Layout.topMargin: 24 - model: ListModel { - ListElement { - label: "Please choose one" - } - ListElement { - label: "Bank of America" - } - ListElement { - label: "Bank of India" - } - ListElement { - label: "Bank of London" - } - } - delegate: ItemDelegate { - contentItem: Text { - text: label - font { - family: Eduport.bodyFont.family - weight: Eduport.bodyFont.weight - pointSize: Eduport.bodyFont.pointSize - } - } - } - background: Rectangle { - radius: 8 - implicitHeight: 36 - implicitWidth: 200 - color: "#f5f7f9" - } - } - } } } } -- cgit v1.2.3