From f65528b4389488e3bdf63d2efd3f3bfbb0217e60 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?=
 <erik@darapsa.co.id>
Date: Thu, 30 Mar 2023 23:04:30 +0800
Subject: CartItem now is for the content of MenuItem

so it can be reused for adding Items (instead of Actions) to the cart menu
---
 Header.ui.qml          |  10 ++++-
 Header/CartItem.ui.qml | 105 +++++++++++++++++++++++++++----------------------
 2 files changed, 67 insertions(+), 48 deletions(-)

diff --git a/Header.ui.qml b/Header.ui.qml
index 2370c7b..daa2af1 100644
--- a/Header.ui.qml
+++ b/Header.ui.qml
@@ -134,7 +134,15 @@ ToolBar {
 				width: 256
 				sourceComponent: background
 			}
-			delegate: CartItem {}
+			delegate: MenuItem {
+				contentItem: CartItem {
+					imageSource: icon.source
+					titleText: text
+				}
+				background: Rectangle {
+					color: "transparent"
+				}
+			}
 
 			Lbl.H5 {
 				text: qsTr("Cart items")
diff --git a/Header/CartItem.ui.qml b/Header/CartItem.ui.qml
index 4f97c29..83600a5 100644
--- a/Header/CartItem.ui.qml
+++ b/Header/CartItem.ui.qml
@@ -5,68 +5,79 @@ import QtGraphicalEffects 1.15
 import Eduport 1.4
 import "../Label" as Lbl
 
-MenuItem {
-	id: menuItem
-	contentItem: ColumnLayout {
+ColumnLayout {
+	property string imageSource:
+		"https://eduport.webestica.com/assets/images/book/02.jpg"
+	property string titleText: "Angular 4 Tutorial in audio (Compact Disk)"
+	property alias button: button
+	property alias comboBox: comboBox
 
-		Loader {
-			Layout.fillWidth: true
-			Layout.topMargin: -24
-			Layout.leftMargin: -8
-			Layout.rightMargin: -8
-			sourceComponent: menuSeparator
+	MenuSeparator {
+		Layout.fillWidth: true
+		contentItem: Rectangle {
+			implicitHeight: 1
+			color: Eduport.mode
+				? Eduport.bsGray300 : Eduport.bsGray500
 		}
+	}
 
-		RowLayout {
-			Layout.margins: 16
+	RowLayout {
+		Layout.margins: 16
 
-			Loader {
-				property string imageSource: menuItem
-								.icon.source
-				property int imageWidth: 50
-				property int imageHeight: 50
-				property real maskRadius: 5.2
-				sourceComponent: image
-				Layout.alignment: Qt.AlignTop
+		Image {
+			Layout.alignment: Qt.AlignTop
+			source: imageSource
+			sourceSize {
+				width: 50
+				height: 50
+			}
+			layer {
+				enabled: true
+				effect: OpacityMask {
+					maskSource: Rectangle {
+						width: 50
+						height: 50
+						radius: 5.2
+					}
+				}
 			}
+		}
 
-			ColumnLayout {
+		ColumnLayout {
 
-				RowLayout {
+			RowLayout {
+				spacing: 0
 
-					Lbl.H6 {
-						text: menuItem.text
-						Layout.fillWidth: true
-					}
+				Lbl.H6 {
+					text: titleText
+					Layout.maximumWidth: 146
+				}
 
-					Button {
-						Layout.alignment: Qt.AlignTop
-						contentItem: Image {
-							source:
-							"../Bootstrap/icons/x.svg"
+				Button {
+					id: button
+					Layout.alignment: Qt.AlignTop
+								| Qt.AlignRight
+					contentItem: Image {
+						source:
+						"../Bootstrap/icons/x.svg"
 
-							ColorOverlay {
-								color: Eduport
-								.bsGray600
-								source: parent
-								anchors.fill:
-									parent
-							}
-						}
-						background: Rectangle {
-							color: "transparent"
-							implicitWidth: 13
+						ColorOverlay {
+							color: Eduport.bsGray600
+							source: parent
+							anchors.fill: parent
 						}
 					}
+					background: Rectangle {
+						color: "transparent"
+						implicitWidth: 13
+					}
 				}
+			}
 
-				ComboBox {
-					model: [1, 2, 3, 4, 5]
-				}
+			ComboBox {
+				id: comboBox
+				model: [1, 2, 3, 4, 5]
 			}
 		}
 	}
-	background: Rectangle {
-		color: "transparent"
-	}
 }
-- 
cgit v1.2.3