Added consumables to transaction and improved transaction entry viewing and pdf generation. Also added transactions this day and this month in technician dashboard

This commit is contained in:
Keannu Christian Bernasol 2024-01-05 19:06:04 +08:00
parent eea2b590d2
commit ad9981ae44
8 changed files with 197 additions and 8 deletions

View file

@ -1,6 +1,11 @@
import { useQueries } from "@tanstack/react-query";
import styles from "../../../styles";
import { EquipmentsAPI, EquipmentInstancesAPI, UserAPI } from "../../API/API";
import {
EquipmentsAPI,
EquipmentInstancesAPI,
UserAPI,
TransactionsAPI,
} from "../../API/API";
import CircularProgress from "@mui/material/CircularProgress";
export default function TechnicianWidgets() {
@ -18,6 +23,10 @@ export default function TechnicianWidgets() {
queryKey: ["user"],
queryFn: UserAPI,
},
{
queryKey: ["transactions"],
queryFn: TransactionsAPI,
},
],
});
const isLoading = queries.some((result) => result.isLoading);
@ -98,7 +107,7 @@ export default function TechnicianWidgets() {
...{ float: "left", position: "absolute" },
}}
>
Items in Database
Equipments in Inventory
</p>
<p
@ -140,7 +149,7 @@ export default function TechnicianWidgets() {
...{ float: "left", position: "absolute" },
}}
>
Functional Items
Available Equipments
</p>
<p
@ -175,7 +184,88 @@ export default function TechnicianWidgets() {
...{ float: "left", position: "absolute" },
}}
>
Broken Items
Broken Equipments
</p>
<p
style={{
...styles.text_dark,
...styles.text_L,
}}
>
{queries[1].data
? queries[1].data.filter(
(equipment) => equipment.status == "Broken"
).length
: 0}
</p>
</div>
</div>
<div
style={{
...styles.flex_row,
...{
alignSelf: "center",
justifyContent: "center",
flexWrap: "wrap",
},
}}
>
<div
style={{
paddingLeft: "16px",
paddingRight: "16px",
margin: "16px",
borderRadius: 16,
backgroundColor: "#a6a6a6",
alignSelf: "center",
justifyContent: "center",
width: "16rem",
}}
>
<p
style={{
...styles.text_dark,
...styles.text_M,
...{ float: "left", position: "absolute" },
}}
>
Transactions Today
</p>
<p
style={{
...styles.text_dark,
...styles.text_L,
}}
>
{queries[3].data
? queries[3].data.filter(
(transactions) => transactions.timestamp == "Available"
).length
: 0}
</p>
</div>
<div
style={{
paddingLeft: "16px",
paddingRight: "16px",
margin: "16px",
borderRadius: 16,
backgroundColor: "#a6a6a6",
alignSelf: "center",
justifyContent: "center",
width: "16rem",
}}
>
<p
style={{
...styles.text_dark,
...styles.text_M,
...{ float: "left", position: "absolute" },
}}
>
Broken Equipments
</p>
<p