Add sales analytics screen

This commit is contained in:
2026-02-28 14:25:55 -07:00
parent 8f77fea963
commit f503a7e2b6
10 changed files with 710 additions and 1 deletions

View File

@@ -143,6 +143,15 @@
</padding>
</Button>
<Button fx:id="btnAnalytics" alignment="CENTER_LEFT" mnemonicParsing="false" onAction="#btnAnalyticsClicked" prefWidth="250.0" style="-fx-background-color: transparent; -fx-background-radius: 10; -fx-cursor: hand; -fx-focus-color: transparent; -fx-faint-focus-color: transparent;" text="Analytics" textFill="#cbd5e1">
<font>
<Font name="System" size="13.0" />
</font>
<padding>
<Insets bottom="10.0" left="14.0" right="14.0" top="10.0" />
</padding>
</Button>
<Region VBox.vgrow="ALWAYS" />
<Button fx:id="btnLogout" alignment="CENTER_LEFT" mnemonicParsing="false" onAction="#btnLogoutClicked" prefWidth="250.0" style="-fx-background-color: rgba(255,255,255,0.08); -fx-background-radius: 10; -fx-cursor: hand; -fx-focus-color: transparent; -fx-faint-focus-color: transparent;" text="Logout" textFill="#e2e8f0">

View File

@@ -0,0 +1,202 @@
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.chart.BarChart?>
<?import javafx.scene.chart.CategoryAxis?>
<?import javafx.scene.chart.LineChart?>
<?import javafx.scene.chart.NumberAxis?>
<?import javafx.scene.chart.PieChart?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.ScrollPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.VBox?>
<?import javafx.scene.text.Font?>
<ScrollPane fitToWidth="true" xmlns="http://javafx.com/javafx/21" xmlns:fx="http://javafx.com/fxml/1" fx:controller="org.example.petshopdesktop.controllers.AnalyticsController">
<VBox spacing="20.0" style="-fx-background-color: #f8fafc;">
<padding>
<Insets bottom="20.0" left="20.0" right="20.0" top="20.0" />
</padding>
<HBox alignment="CENTER_LEFT" spacing="20.0">
<Label text="Sales Analytics" textFill="#2c3e50">
<font>
<Font name="System Bold" size="24.0" />
</font>
</Label>
<Button fx:id="btnRefresh" onAction="#handleRefresh" style="-fx-background-color: #4ECDC4; -fx-text-fill: white; -fx-background-radius: 5; -fx-cursor: hand;" text="Refresh">
<font>
<Font size="13.0" />
</font>
<padding>
<Insets bottom="8.0" left="16.0" right="16.0" top="8.0" />
</padding>
</Button>
</HBox>
<Label fx:id="lblError" textFill="#FF6B6B" visible="false">
<font>
<Font size="13.0" />
</font>
</Label>
<HBox spacing="20.0">
<VBox alignment="CENTER" spacing="8.0" style="-fx-background-color: white; -fx-background-radius: 10; -fx-border-color: #e2e8f0; -fx-border-radius: 10; -fx-border-width: 1;" HBox.hgrow="ALWAYS">
<padding>
<Insets bottom="20.0" left="20.0" right="20.0" top="20.0" />
</padding>
<Label text="Total Revenue" textFill="#64748b">
<font>
<Font size="12.0" />
</font>
</Label>
<Label fx:id="lblTotalRevenue" text="$0.00" textFill="#2c3e50">
<font>
<Font name="System Bold" size="24.0" />
</font>
</Label>
</VBox>
<VBox alignment="CENTER" spacing="8.0" style="-fx-background-color: white; -fx-background-radius: 10; -fx-border-color: #e2e8f0; -fx-border-radius: 10; -fx-border-width: 1;" HBox.hgrow="ALWAYS">
<padding>
<Insets bottom="20.0" left="20.0" right="20.0" top="20.0" />
</padding>
<Label text="Total Transactions" textFill="#64748b">
<font>
<Font size="12.0" />
</font>
</Label>
<Label fx:id="lblTotalTransactions" text="0" textFill="#2c3e50">
<font>
<Font name="System Bold" size="24.0" />
</font>
</Label>
</VBox>
<VBox alignment="CENTER" spacing="8.0" style="-fx-background-color: white; -fx-background-radius: 10; -fx-border-color: #e2e8f0; -fx-border-radius: 10; -fx-border-width: 1;" HBox.hgrow="ALWAYS">
<padding>
<Insets bottom="20.0" left="20.0" right="20.0" top="20.0" />
</padding>
<Label text="Average Transaction Value" textFill="#64748b">
<font>
<Font size="12.0" />
</font>
</Label>
<Label fx:id="lblAvgTransaction" text="$0.00" textFill="#2c3e50">
<font>
<Font name="System Bold" size="24.0" />
</font>
</Label>
</VBox>
<VBox alignment="CENTER" spacing="8.0" style="-fx-background-color: white; -fx-background-radius: 10; -fx-border-color: #e2e8f0; -fx-border-radius: 10; -fx-border-width: 1;" HBox.hgrow="ALWAYS">
<padding>
<Insets bottom="20.0" left="20.0" right="20.0" top="20.0" />
</padding>
<Label text="Total Items Sold" textFill="#64748b">
<font>
<Font size="12.0" />
</font>
</Label>
<Label fx:id="lblTotalItems" text="0" textFill="#2c3e50">
<font>
<Font name="System Bold" size="24.0" />
</font>
</Label>
</VBox>
</HBox>
<VBox spacing="10.0" style="-fx-background-color: white; -fx-background-radius: 10; -fx-border-color: #e2e8f0; -fx-border-radius: 10; -fx-border-width: 1;">
<padding>
<Insets bottom="20.0" left="20.0" right="20.0" top="20.0" />
</padding>
<Label text="Sales Over Time" textFill="#2c3e50">
<font>
<Font name="System Bold" size="16.0" />
</font>
</Label>
<LineChart fx:id="chartSalesOverTime" animated="true" legendSide="BOTTOM" prefHeight="300.0">
<xAxis>
<CategoryAxis label="Date" side="BOTTOM" />
</xAxis>
<yAxis>
<NumberAxis label="Revenue ($)" side="LEFT" />
</yAxis>
</LineChart>
</VBox>
<HBox spacing="20.0">
<VBox spacing="10.0" style="-fx-background-color: white; -fx-background-radius: 10; -fx-border-color: #e2e8f0; -fx-border-radius: 10; -fx-border-width: 1;" HBox.hgrow="ALWAYS">
<padding>
<Insets bottom="20.0" left="20.0" right="20.0" top="20.0" />
</padding>
<Label text="Top Products by Revenue" textFill="#2c3e50">
<font>
<Font name="System Bold" size="16.0" />
</font>
</Label>
<BarChart fx:id="chartTopRevenue" animated="true" legendSide="BOTTOM" prefHeight="300.0">
<xAxis>
<NumberAxis label="Revenue ($)" side="BOTTOM" />
</xAxis>
<yAxis>
<CategoryAxis label="Product" side="LEFT" />
</yAxis>
</BarChart>
</VBox>
<VBox spacing="10.0" style="-fx-background-color: white; -fx-background-radius: 10; -fx-border-color: #e2e8f0; -fx-border-radius: 10; -fx-border-width: 1;" HBox.hgrow="ALWAYS">
<padding>
<Insets bottom="20.0" left="20.0" right="20.0" top="20.0" />
</padding>
<Label text="Top Products by Quantity" textFill="#2c3e50">
<font>
<Font name="System Bold" size="16.0" />
</font>
</Label>
<BarChart fx:id="chartTopQuantity" animated="true" legendSide="BOTTOM" prefHeight="300.0">
<xAxis>
<NumberAxis label="Quantity Sold" side="BOTTOM" />
</xAxis>
<yAxis>
<CategoryAxis label="Product" side="LEFT" />
</yAxis>
</BarChart>
</VBox>
</HBox>
<HBox spacing="20.0">
<VBox spacing="10.0" style="-fx-background-color: white; -fx-background-radius: 10; -fx-border-color: #e2e8f0; -fx-border-radius: 10; -fx-border-width: 1;" HBox.hgrow="ALWAYS">
<padding>
<Insets bottom="20.0" left="20.0" right="20.0" top="20.0" />
</padding>
<Label text="Payment Method Distribution" textFill="#2c3e50">
<font>
<Font name="System Bold" size="16.0" />
</font>
</Label>
<PieChart fx:id="chartPaymentMethods" animated="true" legendSide="BOTTOM" prefHeight="300.0" />
</VBox>
<VBox spacing="10.0" style="-fx-background-color: white; -fx-background-radius: 10; -fx-border-color: #e2e8f0; -fx-border-radius: 10; -fx-border-width: 1;" HBox.hgrow="ALWAYS">
<padding>
<Insets bottom="20.0" left="20.0" right="20.0" top="20.0" />
</padding>
<Label text="Employee Performance" textFill="#2c3e50">
<font>
<Font name="System Bold" size="16.0" />
</font>
</Label>
<BarChart fx:id="chartEmployeePerformance" animated="true" legendSide="BOTTOM" prefHeight="300.0">
<xAxis>
<CategoryAxis label="Employee" side="BOTTOM" />
</xAxis>
<yAxis>
<NumberAxis label="Revenue ($)" side="LEFT" />
</yAxis>
</BarChart>
</VBox>
</HBox>
</VBox>
</ScrollPane>