diff options
| -rw-r--r-- | Student/Dashboard.ui.qml | 46 | ||||
| -rw-r--r-- | Student/Dashboard/CourseListItem.ui.qml | 42 |
2 files changed, 73 insertions, 15 deletions
diff --git a/Student/Dashboard.ui.qml b/Student/Dashboard.ui.qml index 16e8064..6c2a339 100644 --- a/Student/Dashboard.ui.qml +++ b/Student/Dashboard.ui.qml @@ -12,17 +12,29 @@ Flickable { RowLayout { Layout.fillWidth: true + height: 50 Label{ - text: "Course Title" + text: "Course Title" + font.bold: true + font.pixelSize: 30 } Label{ text: "Total Lectures" + font.bold: true + color: "#666666" + font.pixelSize: 30 } Label{ - text: "Completed Lecture" + text: "Completed Lectures" + font.bold: true + color: "#666666" + font.pixelSize: 30 } Label{ text: "Action" + font.bold: true + color: "#666666" + font.pixelSize: 30 } } @@ -35,16 +47,46 @@ Flickable { ListElement { title: qsTr("Building Scalable APIs with GraphQL") image: "https://eduport.webestica.com/assets/images/courses/4by3/08.jpg" + level: "Beginner" + totalLectures: 16 + completedLectures: 14 } ListElement { title: qsTr("Create a Design System in Figma") image: "https://eduport.webestica.com/assets/images/courses/4by3/03.jpg" + level: "Beginner" + totalLectures: 42 + completedLectures: 40 } + ListElement { + title: qsTr("Graphic Design Masterclass") + image: "https://eduport.webestica.com/assets/images/courses/4by3/02.jpg" + level: "Beginner" + totalLectures: 16 + completedLectures: 14 + } + ListElement { + title: qsTr("The Complete Web Development in python") + image: "https://eduport.webestica.com/assets/images/courses/4by3/05.jpg" + level: "Beginner" + totalLectures: 28 + completedLectures: 12 + } + ListElement { + title: qsTr("Digital Marketing Masterclass") + image: "https://eduport.webestica.com/assets/images/courses/4by3/01.jpg" + level: "Advanced" + totalLectures: 32 + completedLectures: 18 + } + // Add more ListElements for other courses } delegate: CourseListItem { width: tableBody.width courseTitle.text: title courseThumb.source: image + + } } } diff --git a/Student/Dashboard/CourseListItem.ui.qml b/Student/Dashboard/CourseListItem.ui.qml index 3a4d407..227d785 100644 --- a/Student/Dashboard/CourseListItem.ui.qml +++ b/Student/Dashboard/CourseListItem.ui.qml @@ -39,6 +39,8 @@ Item { ColumnLayout{ id: courseProgressInfo spacing: 0 + width: parent.width - image.width - spacing + Label{ id: courseTitle color: "#000000" @@ -48,19 +50,30 @@ Item { font.styleName: "Medium" Layout.fillWidth: true } - Label{ - id: courseProgressPercentage - color: "#000000" - text: "80%" - font.pointSize: 16 - font.family: "roboto" - font.styleName: "Medium" - horizontalAlignment: Text.AlignRight - Layout.fillWidth: true - } - ProgressBar { - id: courseProgressBar - value: 0.8 + + RowLayout { // So the Bar and % of value side by side + ProgressBar { + id: courseProgressBar + value: completedLectures / totalLectures * 100 + to: 100 + width: parent.width * 0.7 + height: 10 + background: Rectangle { + color: "#666666" // Background color of the ProgressBar + } + } + Label{ + id: courseProgressPercentage + // color: "#000000" + text: Math.round(completedLectures / totalLectures * 100) + "%" + color: "#666666" + // font.pixelSize: 14 + font.pointSize: 14 + font.family: "roboto" + font.styleName: "Medium" + // horizontalAlignment: Text.AlignRight + // Layout.fillWidth: true + } } } Button { @@ -70,6 +83,9 @@ Item { font.weight: Font.Medium font.family: "Roboto" font.pointSize: 14 + onClicked: { + // Implement resuming logic + } } } } |