Linuxero/pyqcrm
SHA256
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

BarButton still in progress

Browse Source
This commit is contained in:
Daniel Stoppek
2025-03-20 09:19:03 +01:00
parent c49e4ebacd
commit ce26d6d223
14 changed files with 271 additions and 125 deletions
Download Patch File Download Diff File Expand all files Collapse all files

257
Gui/TopBar.qml
View File

@@ -2,11 +2,11 @@ import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
RowLayout
ColumnLayout
{
id: topBar
spacing: 0
width: parent.width
height: parent.height
anchors
{
top: parent.top
@@ -15,194 +15,217 @@ RowLayout
}
Button
BarButton
{
id: dashBoard
flat: true
text: qsTr("Dashboard")
implicitWidth: abrechnung.implicitContentWidth + 10
implicitWidth: 90
implicitHeight: 90
Layout.margins: 3
Layout.leftMargin: 0
background: Rectangle
{
id: dashiBackie
border.width: dashBoard.activeFocus ? 2 : 1
border.color: "#888"
radius: 4
gradient: Gradient
{
GradientStop { position: 0 ; color: dashBoard.pressed ? "#000" : "#001" }
GradientStop { position: 1 ; color: dashBoard.pressed ? "#100" : "#000" }
}
}
Layout.topMargin: Dimensions.s
icon.source: "qrc:/images/dash.svg"
// background: Rectangle
// {
// id: dashiBackie
// border.width: dashBoard.activeFocus ? 2 : 1
// border.color: "#888"
// radius: 4
// gradient: Gradient
// {
// GradientStop { position: 0 ; color: dashBoard.pressed ? "#000" : "#001" }
// GradientStop { position: 1 ; color: dashBoard.pressed ? "#100" : "#000" }
// }
// }
onClicked:
{
appLoader.source = "Dashboard.qml"
dashiBackie.border.width = 2
kundiBackie.border.width = 1
mitoBackie.border.width = 1
invoBackie.border.width = 1
objBackie.border.width = 1
// dashiBackie.border.width = 2
// kundiBackie.border.width = 1
// mitoBackie.border.width = 1
// invoBackie.border.width = 1
// objBackie.border.width = 1
}
}
Button
BarButton
{
id: kunden
flat: true
text: qsTr("Kunden")
implicitWidth: abrechnung.implicitContentWidth + 10
implicitWidth: 90
implicitHeight: 90
Layout.margins: 3
background: Rectangle
{
id: kundiBackie
border.width: kunden.activeFocus ? 2 : 1
border.color: "#888"
radius: 4
gradient: Gradient
{
GradientStop { position: 0 ; color: kunden.pressed ? "#000" : "#001" }
GradientStop { position: 1 ; color: kunden.pressed ? "#100" : "#000" }
}
}
icon.source: "qrc:/images/customer.svg"
// background: Rectangle
// {
// id: kundiBackie
// border.width: kunden.activeFocus ? 2 : 1
// border.color: "#888"
// radius: 4
// gradient: Gradient
// {
// GradientStop { position: 0 ; color: kunden.pressed ? "#000" : "#001" }
// GradientStop { position: 1 ; color: kunden.pressed ? "#100" : "#000" }
// }
// }
onClicked:
{
// TODO: here we should call the model
appLoader.source = "CustomerTable.qml"
kundiBackie.border.width = 2
dashiBackie.border.width = 1
mitoBackie.border.width = 1
invoBackie.border.width = 1
objBackie.border.width = 1
// kundiBackie.border.width = 2
// dashiBackie.border.width = 1
// mitoBackie.border.width = 1
// invoBackie.border.width = 1
// objBackie.border.width = 1
}
}
Button
BarButton
{
id: objekt
flat: true
text: qsTr("Objekt")
implicitWidth: abrechnung.implicitContentWidth + 10
implicitWidth: 90
implicitHeight: 90
Layout.margins: 3
background: Rectangle
{
id: objBackie
border.width: objekt.activeFocus ? 2 : 1
border.color: "#888"
radius: 4
gradient: Gradient
{
GradientStop { position: 0 ; color: objekt.pressed ? "#000" : "#001" }
GradientStop { position: 1 ; color: objekt.pressed ? "#100" : "#000" }
}
}
icon.source: "qrc:/images/object.svg"
// background: Rectangle
// {
// id: objBackie
// border.width: objekt.activeFocus ? 2 : 1
// border.color: "#888"
// radius: 4
// gradient: Gradient
// {
// GradientStop { position: 0 ; color: objekt.pressed ? "#000" : "#001" }
// GradientStop { position: 1 ; color: objekt.pressed ? "#100" : "#000" }
// }
// }
onClicked:
{
appLoader.source = "ObjectTable.qml"
objBackie.border.width = 2
dashiBackie.border.width = 1
kundiBackie.border.width = 1
mitoBackie.border.width = 1
invoBackie.border.width = 1
// objBackie.border.width = 2
// dashiBackie.border.width = 1
// kundiBackie.border.width = 1
// mitoBackie.border.width = 1
// invoBackie.border.width = 1
}
}
Button
BarButton
{
id: mitarbeiter
flat: true
text: qsTr("Mitarbeiter")
implicitWidth: abrechnung.implicitContentWidth + 10
implicitWidth: 90
implicitHeight: 90
Layout.margins: 3
background: Rectangle
{
id: mitoBackie
border.width: mitarbeiter.activeFocus ? 2 : 1
border.color: "#888"
radius: 4
gradient: Gradient
{
GradientStop { position: 0 ; color: mitarbeiter.pressed ? "#000" : "#001" }
GradientStop { position: 1 ; color: mitarbeiter.pressed ? "#100" : "#000" }
}
}
icon.source: "qrc:/images/employee.svg"
// background: Rectangle
// {
// id: mitoBackie
// border.width: mitarbeiter.activeFocus ? 2 : 1
// border.color: "#888"
// radius: 4
// gradient: Gradient
// {
// GradientStop { position: 0 ; color: mitarbeiter.pressed ? "#000" : "#001" }
// GradientStop { position: 1 ; color: mitarbeiter.pressed ? "#100" : "#000" }
// }
// }
onClicked:
{
appLoader.source = "EmployeeTable.qml"
mitoBackie.border.width = 2
dashiBackie.border.width = 1
kundiBackie.border.width = 1
invoBackie.border.width = 1
objBackie.border.width = 1
// mitoBackie.border.width = 2
// dashiBackie.border.width = 1
// kundiBackie.border.width = 1
// invoBackie.border.width = 1
// objBackie.border.width = 1
}
}
Button
BarButton
{
id: offers
flat: true
text: qsTr("Angebote")
implicitWidth: abrechnung.implicitContentWidth + 10
implicitWidth: 90
implicitHeight: 90
Layout.margins: 3
background: Rectangle
{
id: offersBackie
border.width: offers.activeFocus ? 2 : 1
border.color: "#888"
radius: 4
gradient: Gradient
{
GradientStop { position: 0 ; color: offers.pressed ? "#000" : "#001" }
GradientStop { position: 1 ; color: offers.pressed ? "#100" : "#000" }
}
}
icon.source: "qrc:/images/offer.svg"
// background: Rectangle
// {
// id: offersBackie
// border.width: offers.activeFocus ? 2 : 1
// border.color: "#888"
// radius: 4
// gradient: Gradient
// {
// GradientStop { position: 0 ; color: offers.pressed ? "#000" : "#001" }
// GradientStop { position: 1 ; color: offers.pressed ? "#100" : "#000" }
// }
// }
onClicked:
{
appLoader.source = "OfferTable.qml"
mitoBackie.border.width = 2
dashiBackie.border.width = 1
kundiBackie.border.width = 1
invoBackie.border.width = 1
objBackie.border.width = 1
offersBackie.border.width = 1
// mitoBackie.border.width = 2
// dashiBackie.border.width = 1
// kundiBackie.border.width = 1
// invoBackie.border.width = 1
// objBackie.border.width = 1
// offersBackie.border.width = 1
}
}
Button
BarButton
{
id: abrechnung
flat: true
text: qsTr("Abrechnung")
implicitWidth: abrechnung.implicitContentWidth + 10
implicitWidth: 90
implicitHeight: 90
Layout.margins: 3
background: Rectangle
{
id: invoBackie
border.width: abrechnung.activeFocus ? 2 : 1
border.color: "#888"
radius: 4
gradient: Gradient
{
GradientStop { position: 0 ; color: abrechnung.pressed ? "#000" : "#001" }
GradientStop { position: 1 ; color: abrechnung.pressed ? "#100" : "#000" }
}
}
icon.source: "qrc:/images/invoice.svg"
// background: Rectangle
// {
// id: invoBackie
// border.width: abrechnung.activeFocus ? 2 : 1
// border.color: "#888"
// radius: 4
// gradient: Gradient
// {
// GradientStop { position: 0 ; color: abrechnung.pressed ? "#000" : "#001" }
// GradientStop { position: 1 ; color: abrechnung.pressed ? "#100" : "#000" }
// }
// }
}
Item
{
id: hspacer
Layout.fillWidth: true
Layout.fillHeight: true
}
Button
BarButton
{
id: atajos
icon.source: "qrc:/images/menu.svg"
icon.color: "red"
implicitWidth: 90
implicitHeight: 90
flat: true
Layout.rightMargin: 9
Layout.bottomMargin: Dimensions.s
onClicked: mainMenu.open()
Menu {

9
Gui/main.qml
View File

@@ -51,14 +51,11 @@ ApplicationWindow
anchors
{
left: parent.left
left: topBar.right
right: parent.right
top: topBar.bottom
top: parent.top
bottom: parent.bottom
topMargin: 0
bottomMargin: 5
rightMargin: 9
leftMargin: 9
margins: Dimensions.s
}
property alias window: appWindow

87
TeroStyle/BarButton.qml Normal file
View File

@@ -0,0 +1,87 @@
import QtQuick
import QtQuick.Controls.impl
import QtQuick.Controls
import QtQuick.Templates as T
T.ToolButton {
id: control
implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
implicitContentWidth + leftPadding + rightPadding)
implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
implicitContentHeight + topPadding + bottomPadding)
checkable: true
icon.color: Colors.foreground
icon.height: 36
icon.width: 36
topPadding: 20
// horizontalPadding: padding + 2
// spacing: 6
// display: AbstractButton.TextUnderIcon
// icon.color: control.checked || control.highlighted ? control.palette.brightText :
// control.flat && !control.down ? (control.visualFocus ? control.palette.highlight : control.palette.windowText) : control.palette.buttonText
contentItem: Column
{
IconLabel
{
x: parent.width * .5 - width * .5
// height: icon.height
// width: icon.width
icon: control.icon
// display: control.display
}
Label
{
text: control.text
font: Typography.dash
color: Colors.foreground
x: parent.width * .5 - width * .5
}
// spacing: control.spacing
// mirrored: control.mirrored
// display: control.TextUnderIcon
// icon: control.icon
// text: control.text
// font: control.font
// color: control.checked || control.highlighted ? control.palette.brightText :
// control.flat && !control.down ? (control.visualFocus ? control.palette.highlight : control.palette.windowText) : control.palette.buttonText
}
background: Rectangle {
id: mainrect
implicitWidth: control.width
implicitHeight: control.height
visible: !control.flat || control.down || control.checked || control.highlighted
x: control.left
y: control.top
color: Color.blend(control.checked || control.highlighted ? control.palette.dark : control.palette.button,
control.palette.mid, control.down ? 0.5 : 0.0)
border.color: control.palette.highlight
border.width: control.visualFocus ? 2 : 0
Rectangle
{
implicitHeight: control.height
implicitWidth: 6
x: mainrect.left
y: mainrect.top
color: "yellow"
}
}
}

10
TeroStyle/Typography.qml
View File

@@ -27,4 +27,14 @@ Item
letterSpacing: body.letterSpacing,
kerning: body.kerning,
})
readonly property font dash:
({
family: body.family,
pointSize: 10,
weight: body.weight,
letterSpacing: body.letterSpacing,
kerning: body.kerning,
})
}

1
TeroStyle/qmldir
View File

@@ -6,3 +6,4 @@ Button Button.qml
ComboBox ComboBox.qml
Field Field.qml
TextField TextField.qml
BarButton BarButton.qml

3
images/contract.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg data-slot="icon" fill="none" stroke-width="1.5" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 7.5h1.5m-1.5 3h1.5m-7.5 3h7.5m-7.5 3h7.5m3-9h3.375c.621 0 1.125.504 1.125 1.125V18a2.25 2.25 0 0 1-2.25 2.25M16.5 7.5V18a2.25 2.25 0 0 0 2.25 2.25M16.5 7.5V4.875c0-.621-.504-1.125-1.125-1.125H4.125C3.504 3.75 3 4.254 3 4.875V18a2.25 2.25 0 0 0 2.25 2.25h13.5M6 7.5h3v3H6v-3Z"></path>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 502 B

3
images/customer.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg data-slot="icon" fill="none" stroke-width="1.5" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M18 18.72a9.094 9.094 0 0 0 3.741-.479 3 3 0 0 0-4.682-2.72m.94 3.198.001.031c0 .225-.012.447-.037.666A11.944 11.944 0 0 1 12 21c-2.17 0-4.207-.576-5.963-1.584A6.062 6.062 0 0 1 6 18.719m12 0a5.971 5.971 0 0 0-.941-3.197m0 0A5.995 5.995 0 0 0 12 12.75a5.995 5.995 0 0 0-5.058 2.772m0 0a3 3 0 0 0-4.681 2.72 8.986 8.986 0 0 0 3.74.477m.94-3.197a5.971 5.971 0 0 0-.94 3.197M15 6.75a3 3 0 1 1-6 0 3 3 0 0 1 6 0Zm6 3a2.25 2.25 0 1 1-4.5 0 2.25 2.25 0 0 1 4.5 0Zm-13.5 0a2.25 2.25 0 1 1-4.5 0 2.25 2.25 0 0 1 4.5 0Z"></path>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 734 B

3
images/dash.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg data-slot="icon" fill="none" stroke-width="1.5" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M6.429 9.75 2.25 12l4.179 2.25m0-4.5 5.571 3 5.571-3m-11.142 0L2.25 7.5 12 2.25l9.75 5.25-4.179 2.25m0 0L21.75 12l-4.179 2.25m0 0 4.179 2.25L12 21.75 2.25 16.5l4.179-2.25m11.142 0-5.571 3-5.571-3"></path>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 419 B

3
images/employee.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg data-slot="icon" fill="none" stroke-width="1.5" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M15 9h3.75M15 12h3.75M15 15h3.75M4.5 19.5h15a2.25 2.25 0 0 0 2.25-2.25V6.75A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25v10.5A2.25 2.25 0 0 0 4.5 19.5Zm6-10.125a1.875 1.875 0 1 1-3.75 0 1.875 1.875 0 0 1 3.75 0Zm1.294 6.336a6.721 6.721 0 0 1-3.17.789 6.721 6.721 0 0 1-3.168-.789 3.376 3.376 0 0 1 6.338 0Z"></path>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 540 B

3
images/invoice.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg data-slot="icon" fill="none" stroke-width="1.5" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M21 12a2.25 2.25 0 0 0-2.25-2.25H15a3 3 0 1 1-6 0H5.25A2.25 2.25 0 0 0 3 12m18 0v6a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 18v-6m18 0V9M3 12V9m18 0a2.25 2.25 0 0 0-2.25-2.25H5.25A2.25 2.25 0 0 0 3 9m18 0V6a2.25 2.25 0 0 0-2.25-2.25H5.25A2.25 2.25 0 0 0 3 6v3"></path>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 491 B

3
images/object.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg data-slot="icon" fill="none" stroke-width="1.5" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M2.25 21h19.5m-18-18v18m10.5-18v18m6-13.5V21M6.75 6.75h.75m-.75 3h.75m-.75 3h.75m3-6h.75m-.75 3h.75m-.75 3h.75M6.75 21v-3.375c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21M3 3h12m-.75 4.5H21m-3.75 3.75h.008v.008h-.008v-.008Zm0 3h.008v.008h-.008v-.008Zm0 3h.008v.008h-.008v-.008Z"></path>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 522 B

3
images/offer.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg data-slot="icon" fill="none" stroke-width="1.5" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M6 6.878V6a2.25 2.25 0 0 1 2.25-2.25h7.5A2.25 2.25 0 0 1 18 6v.878m-12 0c.235-.083.487-.128.75-.128h10.5c.263 0 .515.045.75.128m-12 0A2.25 2.25 0 0 0 4.5 9v.878m13.5-3A2.25 2.25 0 0 1 19.5 9v.878m0 0a2.246 2.246 0 0 0-.75-.128H5.25c-.263 0-.515.045-.75.128m15 0A2.25 2.25 0 0 1 21 12v6a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 18v-6c0-.98.626-1.813 1.5-2.122"></path>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 590 B

7
pyqcrm.qrc
View File

@@ -17,5 +17,12 @@
<file>README</file>
<file>LICENSE</file>
<file>images/tero.jpg</file>
<file>images/dash.svg</file>
<file>images/invoice.svg</file>
<file>images/offer.svg</file>
<file>images/employee.svg</file>
<file>images/customer.svg</file>
<file>images/contract.svg</file>
<file>images/object.svg</file>
</qresource>
</RCC>

2
qml.qrc
View File

@@ -57,7 +57,7 @@
<file>TeroStyle/qmldir</file>
<file>TeroStyle/TextField.qml</file>
<file>TeroStyle/Typography.qml</file>
<file>TeroStyle/BarButton.qml</file>
</qresource>
<qresource prefix="/TeroStyle"/>
</RCC>