diff --git a/src/activities/server/components/ManageGroupsBar.qml b/src/activities/server/components/ManageGroupsBar.qml index 4bdd95aed..95c2033cc 100644 --- a/src/activities/server/components/ManageGroupsBar.qml +++ b/src/activities/server/components/ManageGroupsBar.qml @@ -1,349 +1,344 @@ import QtQuick 2.9 import QtQuick.Layouts 1.12 //import QtQuick.Controls 1.4 import "../../../core" import QtQuick.Dialogs 1.3 import QtQuick.Controls 2.3 import "../components" import "../server.js" as Activity Item { id: pupilsNavigationBarItem property bool isCollapsed: true property int groupTextMargin: 30 anchors { top: parent.top bottom: parent.bottom left: parent.left } width: Style.widthNavigationButton Rectangle { id: pupilsNavigationRectangle width: parent.width height: parent.height color: Style.colourBackground border.width: 1 border.color: "lightgrey" ColumnLayout{ id: groupNames spacing: 2 anchors.top: parent.top width: parent.width - 10 //groups header Rectangle { id: test height: 60 width: parent.width RowLayout { width: parent.width height: parent.height Rectangle { Layout.fillHeight: true Layout.minimumWidth: pupilsNavigationRectangle.width/5 Text { anchors.verticalCenter: parent.verticalCenter anchors.horizontalCenter: parent.horizontalCenter color: Style.colourNavigationBarBackground font { family: Style.fontAwesome pixelSize: Style.pixelSizeNavigationBarIcon/2 } text: "\uf0c0" font.bold: true leftPadding: 20 topPadding: 20 } } Rectangle { implicitHeight: 60 Layout.fillWidth: true Layout.fillHeight: true Text { anchors.verticalCenter: parent.verticalCenter anchors.left: parent.left leftPadding: 10 topPadding: 20 text: qsTr("Groups") font.bold: true color: Style.colourNavigationBarBackground } } } } //groups names Repeater { id: groupsNamesRepeater model: Activity.groupsNamesArray Rectangle { id: groupNameRectangle width: groupNames.width Layout.preferredHeight: 40 RowLayout { id: groupNameRow width: pupilsNavigationRectangle.width - 10 height: 40 Rectangle { Layout.fillHeight: true Layout.minimumWidth: pupilsNavigationRectangle.width/5 color: "transparent" Text { text: "\uf054" anchors.horizontalCenter: parent.horizontalCenter anchors.verticalCenter: parent.verticalCenter leftPadding: 20 color: "grey" font { family: Style.fontAwesome pixelSize: Style.pixelSizeNavigationBarIcon / 2 } } } Rectangle { Layout.fillWidth: true Layout.fillHeight: true height: 40 color: "transparent" Text { text: modelData anchors.verticalCenter: parent.verticalCenter width: parent.width color: "grey" leftPadding: 5 elide: Text.ElideRight } } Rectangle { id: elipsis Layout.minimumWidth: pupilsNavigationRectangle.width/5 Layout.fillHeight: true height: 40 color: "transparent" Text { id: elipsisText text: "\uf142" //elipsis-v anchors.horizontalCenter: parent.horizontalCenter anchors.verticalCenter: parent.verticalCenter color: "grey" font { family: Style.fontAwesome pixelSize: Style.pixelSizeNavigationBarIcon / 2 //? see with style } } } } MouseArea { //anchors.fill: groupNameRectangle anchors.right: groupNameRectangle.right anchors.top: groupNameRectangle.top height: groupNameRectangle.height width: groupNameRectangle.width //anchors.fill: parent hoverEnabled: true - onClicked: { - elipsisText.color = Style.colourNavigationBarBackground - modifyGroupCommandsRectangle.open() - } onEntered: { elipsisText.color = Style.colourNavigationBarBackground modifyGroupCommandsRectangle.visible = true groupNameRectangle.color = Style.colourPanelBackgroundHover } onExited: { elipsisText.color = "grey" modifyGroupCommandsRectangle.visible = false groupNameRectangle.color = Style.colourBackground } Rectangle { id: modifyGroupCommandsRectangle anchors.right: parent.right visible: false height: groupNameRow.height width: 100 color: "transparent" RowLayout { width: pupilsNavigationRectangle.width/3 height: parent.height Rectangle { id: editIconRectangle Layout.fillWidth: true Layout.preferredWidth: modifyGroupCommandsRectangle/2 Layout.preferredHeight: editIcon.height color: "transparent" Text { id: editIcon text: "\uf304" anchors.centerIn: parent color: "grey" font { family: Style.fontAwesome pixelSize: Style.pixelSizeNavigationBarIcon / 2 } } MouseArea { anchors.fill: parent hoverEnabled: true onClicked: { - addAGroupText.color = Style.colourNavigationBarBackground modifyGroupDialog.inputText = modelData console.log("--" + index) modifyGroupDialog.groupNameIndex = index modifyGroupDialog.open() console.log("clicked ...") } onEntered: { editIcon.color = Style.colourNavigationBarBackground } onExited: { editIcon.color = Style.colourCommandBarFontDisabled } } } Rectangle { Layout.preferredWidth: modifyGroupCommandsRectangle/2 Layout.preferredHeight: editIcon.height Layout.fillWidth: true color: "transparent" Text { id: trashIcon text: "\uf2ed" anchors.centerIn: parent color: "grey" font { family: Style.fontAwesome pixelSize: Style.pixelSizeNavigationBarIcon / 2 } } MouseArea { anchors.fill: parent hoverEnabled: true onClicked: { addAGroupText.color = Style.colourNavigationBarBackground removeGroupDialog.groupNameIndex = index removeGroupDialog.open() console.log("clicked ...") } onEntered: { trashIcon.color = Style.colourNavigationBarBackground } onExited: { trashIcon.color = Style.colourCommandBarFontDisabled } } } } } AddModifyGroupDialog { id: modifyGroupDialog property int groupNameIndex label: "Modify Group Name" inputText: "testdefault" onAccepted: { console.log("save.dfg..") console.log(textInputValue) Activity.groupsNamesArray[groupNameIndex] = textInputValue console.log(Activity.groupsNamesArray) groupsNamesRepeater.model = Activity.groupsNamesArray modifyGroupDialog.close() } } AddModifyGroupDialog { id: removeGroupDialog property int groupNameIndex label: qsTr("Are you sure you want to remove the group") inputText: Activity.groupsNamesArray[groupNameIndex] textInputReadOnly: true onAccepted: { console.log("save.dfg..") console.log(textInputValue) Activity.groupsNamesArray[groupNameIndex] = textInputValue console.log(Activity.groupsNamesArray) groupsNamesRepeater.model = Activity.groupsNamesArray modifyGroupDialog.close() } } } } } } Rectangle { id: addAGroupLabelRectangle anchors.top: groupNames.bottom anchors.left: parent.left width: parent.width - 10 height: 40 Text { id: addAGroupText text: "\uf067" + qsTr("Add a group") anchors.horizontalCenter: parent.horizontalCenter anchors.verticalCenter: parent.verticalCenter leftPadding: 5 color: "grey" font { family: Style.fontAwesome pixelSize: Style.pixelSizeNavigationBarIcon / 3 //? see with style } } MouseArea { anchors.fill: parent hoverEnabled: true onClicked: { addAGroupText.color = Style.colourNavigationBarBackground addGroupDialog.open() console.log("clicked ...") } onEntered: { addAGroupText.color = Style.colourNavigationBarBackground } onExited: { addAGroupText.color = "grey" } } AddModifyGroupDialog { id: addGroupDialog label: qsTr("Add a group name") inputText: qsTr("Group name") onAccepted: { console.log("save new group..") console.log(textInputValue) Activity.groupsNamesArray.push(textInputValue) console.log(Activity.groupsNamesArray) groupsNamesRepeater.model = Activity.groupsNamesArray addGroupDialog.close() } } } } } diff --git a/src/activities/server/views/ManagePupilsView.qml b/src/activities/server/views/ManagePupilsView.qml index cb73f3c72..5c66f5d8c 100644 --- a/src/activities/server/views/ManagePupilsView.qml +++ b/src/activities/server/views/ManagePupilsView.qml @@ -1,227 +1,396 @@ import QtQuick 2.12 import QtQuick.Layouts 1.12 import QtQml.Models 2.12 import CM 1.0 import "../components" import "../../../core" import QtQuick.Controls 2.2 import "." import "../server.js" as Activity Item { + id: managePupilsView + + width: activity.width // property Client newClient: masterController.ui_newClient Rectangle { anchors.fill: parent color: Style.colourBackground Text { anchors.centerIn: parent text: "Manage Pupils View" } } TopBanner { id: topBanner text: "Groups and pupils management" } ManageGroupsBar { id: pupilsNavigationBar anchors.top: topBanner.bottom } Rectangle { id: managePupilsViewRectangle anchors.left: pupilsNavigationBar.right anchors.top: topBanner.bottom anchors.right: parent.right anchors.bottom: parent.bottom + width: managePupilsView.width //color: "red" ColumnLayout{ id: pupilsDetailsColumn spacing: 2 anchors.top: parent.top width: parent.width - 10 property int pupilNameColWidth : pupilsDetailsColumn.width/3 property int yearOfBirthColWidth : pupilsDetailsColumn.width/8 //pupils header Rectangle { - id: test + id: pupilsHeaderRectangle height: 60 width: parent.width RowLayout { width: managePupilsViewRectangle.width - 10 height: parent.height Rectangle { id: pupilNameHeader Layout.fillHeight: true Layout.minimumWidth: pupilsDetailsColumn.pupilNameColWidth Text { anchors.verticalCenter: parent.verticalCenter color: Style.colourNavigationBarBackground text: "Pupils Names" font.bold: true - leftPadding: 20 + leftPadding: 60 topPadding: 20 } } Rectangle { id: yearOfBirthHeader Layout.fillHeight: true Layout.minimumWidth: pupilsDetailsColumn.yearOfBirthColWidth //any way to find "year of birth text width" if translations ? Text { anchors.verticalCenter: parent.verticalCenter anchors.horizontalCenter: parent.horizontalCenter text: "Year of Birth" font.bold: true color: Style.colourNavigationBarBackground topPadding: 20 } } Rectangle { Layout.fillWidth: true Layout.fillHeight: true Text { anchors.verticalCenter: parent.verticalCenter anchors.left: parent.left leftPadding: 10 text: "Groups" font.bold: true color: Style.colourNavigationBarBackground topPadding: 20 } } } } //pupils data Repeater { - id: repeater + id: pupilsDetailsRepeater model: Activity.pupilsNamesArray Rectangle { - width: parent.width - Layout.preferredHeight: 40 + id: pupilDetailsRectangle + width: managePupilsViewRectangle.width - navigationBar.width + height: 40 + + //Layout.preferredHeight: 40 + + color: "blue" + border.color: "green" + border.width: 5 RowLayout { - width: managePupilsViewRectangle.width - 10 + width: parent.width height: 40 Rectangle { id: pupilName Layout.fillHeight: true Layout.minimumWidth: pupilsDetailsColumn.pupilNameColWidth - Text { + color: "transparent" + CheckBox { text: modelData[0] - //anchors.horizontalCenter: parent.horizontalCenter anchors.verticalCenter: parent.verticalCenter leftPadding: 20 - color: "grey" } } Rectangle { id: yearOfBirth Layout.fillHeight: true Layout.minimumWidth: pupilsDetailsColumn.yearOfBirthColWidth //any way to find "year of birth text width" if translations ? + color: "transparent" Text { id: yearText text: modelData[1] anchors.verticalCenter: parent.verticalCenter anchors.horizontalCenter: parent.horizontalCenter color: "grey" } } Rectangle { id: groups - Layout.fillWidth: true + Layout.minimumWidth: 30 Layout.fillHeight: true height: 40 + color: "transparent" Text { id: elipsisText - text: modelData[2] + text: "yy" //modelData[2] leftPadding: 10 anchors.verticalCenter: parent.verticalCenter color: "grey" } } + Rectangle { + id: pupilCommandOptions + Layout.fillWidth: true + Layout.fillHeight: true + height: 40 + color: "transparent" + Text { + id: pupilElipsisV + text: "options" + leftPadding: 10 + anchors.verticalCenter: parent.verticalCenter + color: "grey" + } + } + } + + MouseArea { + + anchors.right: pupilDetailsRectangle.right + anchors.top: pupilDetailsRectangle.top + height: pupilDetailsRectangle.height + width: pupilDetailsRectangle.width - 50 + + //anchors.fill: parent + hoverEnabled: true + onEntered: { modifyPupilCommandsRectangle.visible = true + pupilDetailsRectangle.color = Style.colourPanelBackgroundHover + } + onExited: { + modifyPupilCommandsRectangle.visible = false + pupilDetailsRectangle.color = Style.colourBackground + } + + Rectangle { + id: modifyPupilCommandsRectangle + + anchors.right: parent.right + visible: false + height: pupilDetailsRow.height + width: 100 + color: "transparent" + + RowLayout { + id: pupilDetailsRow + width: parent.width + height: parent.height + + Rectangle { + id: editIconRectangle + + Layout.fillWidth: true + Layout.preferredWidth: modifyPupilCommandsRectangle/2 + Layout.preferredHeight: editIcon.height + color: "transparent" + + Text { + id: editIcon + text: "\uf304" + anchors.centerIn: parent + color: "grey" + font { + family: Style.fontAwesome + pixelSize: Style.pixelSizeNavigationBarIcon / 2 + } + } + MouseArea { + anchors.fill: parent + hoverEnabled: true + onClicked: { + modifyPupilDialog.inputText = modelData[0] + console.log("--" + index) + modifyPupilDialog.pupilDetailsIndex = index + modifyPupilDialog.open() + console.log("clicked ...") + } + onEntered: { editIcon.color = Style.colourNavigationBarBackground } + onExited: { editIcon.color = Style.colourCommandBarFontDisabled } + } + } + Rectangle { + Layout.preferredWidth: modifyPupilCommandsRectangle/2 + Layout.preferredHeight: editIcon.height + Layout.fillWidth: true + color: "transparent" + + Text { + id: trashIcon + text: "\uf2ed" + anchors.centerIn: parent + color: "grey" + font { + family: Style.fontAwesome + pixelSize: Style.pixelSizeNavigationBarIcon / 2 + } + } + MouseArea { + anchors.fill: parent + hoverEnabled: true + onClicked: { + addAGroupText.color = Style.colourNavigationBarBackground + removeGroupDialog.pupilDetailsIndex = index + removeGroupDialog.open() + console.log("clicked ...") + } + onEntered: { trashIcon.color = Style.colourNavigationBarBackground } + onExited: { trashIcon.color = Style.colourCommandBarFontDisabled } + } + } + } + } + + + AddModifyGroupDialog { + id: modifyPupilDialog + + property int pupilDetailsIndex + + label: "Modify Pupil Details" + inputText: "testdefault" + + onAccepted: { + console.log("save.dfg..") + console.log(textInputValue) + Activity.pupilsNamesArray[pupilDetailsIndex][0] = textInputValue + Activity.pupilsNamesArray[pupilDetailsIndex][1] = "2004" + console.log(Activity.pupilsNamesArray) + pupilsDetailsRepeater.model = Activity.pupilsNamesArray + modifyPupilDialog.close() + } + } + + AddModifyGroupDialog { + id: removeGroupDialog + + property int groupNameIndex + + label: qsTr("Are you sure you want to remove the group") + inputText: Activity.groupsNamesArray[groupNameIndex] + + textInputReadOnly: true + + onAccepted: { + console.log("save.dfg..") + console.log(textInputValue) + Activity.groupsNamesArray[groupNameIndex][0] = textInputValue + Activity.groupsNamesArray[groupNameIndex][1] = "2004" + console.log(Activity.groupsNamesArray) + pupilsDetailsRepeater.model = Activity.pupilsNamesArray + modifyGroupDialog.close() + } + } + + + } + + } + } } } CommandBar { commandList: masterController.ui_commandController.ui_managePupilsViewContextCommands } /* ScrollView { id: scrollView anchors { left: parent.left right: parent.right top: parent.top //bottom: commandBar.top margins: Style.sizeScreenMargin } clip: true Column { spacing: Style.sizeScreenMargin width: scrollView.width Panel { headerText: "Client Details" contentComponent: Column { spacing: Style.sizeControlSpacing StringEditorSingleLine { stringDecorator: newClient.ui_reference anchors { left: parent.left right: parent.right } } StringEditorSingleLine { stringDecorator: newClient.ui_name anchors { left: parent.left right: parent.right } } } } AddressEditor { address: newClient.ui_supplyAddress headerText: "Supply Address" } AddressEditor { address: newClient.ui_billingAddress headerText: "Billing Address" } } } */ }