keannu125/Borrowing-TrackerFrontend
1
0
Fork 0
mirror of https://github.com/lemeow125/Borrowing-TrackerFrontend.git synced 2025-06-29 08:55:48 +08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge branch 'master' of https://git.keannu1.duckdns.org/keannu125/Borrowing-TrackerFrontend into feature/additional_styles

Browse source
This commit is contained in:
Jerilyn Yare 2024-01-07 13:22:01 +08:00
commit 94d41b3194
11 changed files with 262 additions and 200 deletions
Download patch file Download diff file Expand all files Collapse all files

105
src/Pages/AddTransactionPage/AddTransactionPage.tsx
View file

@ -20,6 +20,7 @@ import {
CircularProgress,
MenuItem,
OutlinedInput,
Autocomplete,
} from "@mui/material";
import React from "react";
import Header from "../../Components/Header/Header";
@ -32,10 +33,10 @@ export default function AddTransactionPage() {
equipments: [] as number[],
teacher: 0,
subject: "",
remarks: " ",
remarks: "",
transaction_status: "Pending Approval",
consumables: " ",
additional_members: " ",
consumables: "",
additional_members: "",
borrower: 0,
});
/*
@ -126,29 +127,50 @@ export default function AddTransactionPage() {
<div style={{...styles.flex_column, marginLeft: "1rem", marginRight: "1rem"}}>
<FormControl style={{ marginTop: "8px" }}>
<FormLabel style={{...styles.text_dark, ...styles.bform_label2}}>Items Requested</FormLabel>
<Select
<FormLabel
style={{
...{...styles.text_dark, ...styles.bform_label2},
...{ marginLeft: "4px", marginBottom: "8px", textAlign: "left" },
}}
>
Items Requested
</FormLabel>
<Autocomplete
multiple
value={transaction.equipments}
onChange={(event) =>
id="equipment-autocomplete"
options={equipments.data?.sort((a, b) => a.id - b.id) || []}
getOptionLabel={(option) =>
`${option.equipment_name} (ID:${option.id})`
}
value={
equipments.data?.filter((equipment) =>
transaction.equipments.includes(equipment.id)
) || []
}
onChange={(_event, newValue) => {
SetTransaction({
...transaction,
equipments: event.target.value as number[],
})
}
input={<OutlinedInput />}
>
{equipments.data
?.filter((equipment) => equipment.status == "Available")
.map((equipment) => (
<MenuItem key={equipment.id} value={equipment.id}>
{`${equipment.equipment_name} (ID:${equipment.id})`}
</MenuItem>
))}
</Select>
equipments: newValue.map((item) => item.id),
});
}}
renderInput={(params) => (
<TextField
{...params}
variant="outlined"
label="Items Requested"
/>
)}
/>
</FormControl>
<FormControl style={{ marginTop: "8px" }}>
<FormLabel style={{...styles.text_dark, ...styles.bform_label2}}>Assigned Teacher</FormLabel>
<FormLabel
style={{
...styles.text_dark,
...{ marginLeft: "4px", marginBottom: "4px", textAlign: "left" },
}}
>
Assigned Teacher
</FormLabel>
<Select
value={transaction.teacher}
onChange={(event) =>
@ -157,9 +179,7 @@ export default function AddTransactionPage() {
teacher: event.target.value as number,
})
}
label={"Assigned Teacher"}
input={<OutlinedInput />}
>
{teachers.data?.map((teacher) => (
<MenuItem key={teacher.id} value={teacher.id}>
@ -169,7 +189,14 @@ export default function AddTransactionPage() {
</Select>
</FormControl>
<FormControl style={{ marginTop: "8px" }}>
<FormLabel style={{...styles.text_dark, ...styles.bform_label}}>Subject</FormLabel>
<FormLabel
style={{
...styles.text_dark,
...{ marginLeft: "4px", marginBottom: "4px", textAlign: "left" },
}}
>
Subject
</FormLabel>
<TextField
style={styles.input_form}
onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
@ -181,7 +208,14 @@ export default function AddTransactionPage() {
/>
</FormControl>
<FormControl style={{ marginTop: "8px" }}>
<FormLabel style={{...styles.text_dark, ...styles.bform_label}}>Remarks</FormLabel>
<FormLabel
style={{
...styles.text_dark,
...{ marginLeft: "4px", marginBottom: "4px", textAlign: "left" },
}}
>
Remarks
</FormLabel>
<TextField
multiline
style={styles.input_form}
@ -194,7 +228,14 @@ export default function AddTransactionPage() {
/>
</FormControl>
<FormControl style={{ marginTop: "8px" }}>
<FormLabel style={{...styles.text_dark, ...styles.bform_label}}>Consumables</FormLabel>
<FormLabel
style={{
...styles.text_dark,
...{ marginLeft: "4px", marginBottom: "4px", textAlign: "left" },
}}
>
Consumables
</FormLabel>
<TextField
multiline
style={styles.input_form}
@ -207,7 +248,14 @@ export default function AddTransactionPage() {
/>
</FormControl>
<FormControl style={{ marginTop: "8px" }}>
<FormLabel style={{...styles.text_dark, ...styles.bform_label}}>Additional Members</FormLabel>
<FormLabel
style={{
...styles.text_dark,
...{ marginLeft: "4px", marginBottom: "4px", textAlign: "left" },
}}
>
Additional Members
</FormLabel>
<TextField
multiline
style={styles.input_form}
@ -261,6 +309,9 @@ export default function AddTransactionPage() {
queryClient.invalidateQueries({
queryKey: ["equipment_instances"],
});
queryClient.invalidateQueries({
queryKey: ["equipment_instances_available"],
});
queryClient.invalidateQueries({
queryKey: ["transactions"],
});