Style EmployeesTable

This commit is contained in:
Yuri Becker
2025-04-16 12:02:21 +02:00
parent cf5822c950
commit 2832becccf
4 changed files with 90 additions and 71 deletions

View File

@@ -58,24 +58,28 @@ ColumnLayout {
onClicked: contentStack.push("AddEmployee.qml") onClicked: contentStack.push("AddEmployee.qml")
} }
} }
HorizontalHeaderView { ColumnLayout {
Layout.fillHeight: true
Layout.fillWidth: true Layout.fillWidth: true
implicitHeight: 40 spacing: 2
movableColumns: true //@disable-check M16
syncView: appliEmpTable HorizontalHeaderView {
movableColumns: true
syncView: employeesTable
delegate: Rectangle { delegate: Rectangle {
Layout.fillWidth: true Layout.fillWidth: true
border.color: palette.base color: Colors.primary
color: palette.alternateBase implicitHeight: 33
implicitHeight: 40
implicitWidth: 1 implicitWidth: 1
Text { Text {
color: palette.text color: Colors.primaryContrast
elide: Text.ElideRight elide: Text.ElideRight
font: Typography.smallBold
height: parent.height height: parent.height
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignLeft
padding: Dimensions.s
text: model.display text: model.display
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
width: parent.width width: parent.width
@@ -83,12 +87,11 @@ ColumnLayout {
} }
} }
TableView { TableView {
id: appliEmpTable id: employeesTable
Layout.fillHeight: true Layout.fillHeight: true
Layout.fillWidth: true Layout.fillWidth: true
alternatingRows: true columnSpacing: 2
columnSpacing: 1
model: employee_model model: employee_model
resizableColumns: true resizableColumns: true
rowSpacing: 2 rowSpacing: 2
@@ -96,47 +99,44 @@ ColumnLayout {
z: 1 z: 1
ScrollBar.vertical: ScrollBar { ScrollBar.vertical: ScrollBar {
policy: appliEmpTable.contentHeight > appliEmpTable.height ? ScrollBar.AlwaysOn : ScrollBar.AlwaysOff policy: ScrollBar.AsNeeded
} }
delegate: Rectangle { delegate: Rectangle {
required property bool current
required property bool selected required property bool selected
color: selected ? palette.highlight : (appliEmpTable.alternatingRows && row % 2 !== 0 ? palette.base : palette.alternateBase) color: selected ? Colors.primaryHighlight : Colors.transparent
implicitHeight: 25 implicitHeight: 33
implicitWidth: appliEmpTable.width / appliEmpTable.columns implicitWidth: employeesTable.width / employeesTable.columns
Text { Text {
color: palette.text color: Colors.foreground
elide: Text.ElideRight elide: Text.ElideRight
font: Typography.small
height: parent.height height: parent.height
leftPadding: 9 padding: Dimensions.s
text: (model.display === null || model.display === undefined) ? "" : model.display text: (model.display === null || model.display === undefined) ? "" : model.display
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
width: parent.width width: parent.width
} }
MouseArea { MouseArea {
property bool hovered: false
anchors.fill: parent anchors.fill: parent
cursorShape: Qt.PointingHandCursor
hoverEnabled: true hoverEnabled: true
onDoubleClicked: { onClicked: {
contentStack.push("EmployeeDetails.qml", { contentStack.push("EmployeeDetails.qml", {
selectedEmployee: row selectedEmployee: row
}); });
} }
onEntered: { onEntered: {
appliEmpTable.selectionModel.select(appliEmpTable.model.index(row, 0), ItemSelectionModel.SelectCurrent | ItemSelectionModel.Rows); employeesTable.selectionModel.select(employeesTable.model.index(row, 0), ItemSelectionModel.SelectCurrent | ItemSelectionModel.Rows);
} }
} }
} }
selectionModel: ItemSelectionModel { selectionModel: ItemSelectionModel {
model: appliEmpTable.model model: employeesTable.model
} }
} }
Item {
Layout.fillWidth: true
} }
} }

View File

@@ -29,7 +29,7 @@ T.ToolButton {
} }
Label { Label {
color: parent.color color: parent.color
font: Typography.small font: Typography.smaller
text: control.text text: control.text
x: parent.width * .5 - width * .5 x: parent.width * .5 - width * .5
} }

View File

@@ -12,6 +12,7 @@ QtObject {
readonly property color primaryContrast: "#fdfdfd" readonly property color primaryContrast: "#fdfdfd"
readonly property color primaryLighter: Qt.lighter(primary, 1.5) readonly property color primaryLighter: Qt.lighter(primary, 1.5)
readonly property color primaryShade: theme === dark ? primaryLighter : Qt.darker(primary, 1.5) readonly property color primaryShade: theme === dark ? primaryLighter : Qt.darker(primary, 1.5)
readonly property color primaryHighlight: theme === dark ? Qt.darker(primary, 2- Colors.highlightOpacity) : Qt.lighter(primary, 2- Colors.highlightOpacity)
readonly property color foreground: theme === dark ? "#fdfdfd" : "#110b0c" readonly property color foreground: theme === dark ? "#fdfdfd" : "#110b0c"
readonly property color background: theme === dark ? "#303136" : "#eff1f5" readonly property color background: theme === dark ? "#303136" : "#eff1f5"
readonly property color mantle: theme === dark ? "#1E1E23" : "#e7e9ef" readonly property color mantle: theme === dark ? "#1E1E23" : "#e7e9ef"

View File

@@ -11,7 +11,25 @@ Item {
letterSpacing: 0, letterSpacing: 0,
kerning: true kerning: true
}) })
readonly property font small: ({ readonly property font small: ({
family: body.family,
pointSize: 14,
weight: Font.Medium,
letterSpacing: body.letterSpacing,
kerning: body.kerning
})
readonly property font smallBold: ({
family: small.family,
pointSize: small.pointSize,
weight: Font.Bold,
letterSpacing: small.letterSpacing,
kerning: small.kerning
})
readonly property font smaller: ({
family: body.family, family: body.family,
pointSize: 11, pointSize: 11,
weight: Font.DemiBold, weight: Font.DemiBold,