ui updates

This commit is contained in:
2025-02-03 10:18:43 -06:00
parent faa8f13a42
commit ee4baa3d50
5 changed files with 10 additions and 7 deletions
+2 -2
View File
@@ -1,4 +1,4 @@
#Staging API #Staging API
VITE_API_URL=https://barkdev.ts.drewr.io #VITE_API_URL=https://barkdev.ts.drewr.io
#Local Dev API #Local Dev API
#VITE_API_URL=http://localhost:5145 VITE_API_URL=http://localhost:5145
@@ -1,4 +1,4 @@
import {Button, Group, TextInput, Text, Textarea, NumberInput, Container, Title, Flex} from '@mantine/core'; import {Button, Group, TextInput, Textarea, NumberInput, Container, Title, Flex} from '@mantine/core';
import {useForm} from '@mantine/form'; import {useForm} from '@mantine/form';
import {useParams} from "react-router"; import {useParams} from "react-router";
import {useMutation, useQuery, useQueryClient} from "@tanstack/react-query"; import {useMutation, useQuery, useQueryClient} from "@tanstack/react-query";
@@ -13,6 +13,7 @@ function EditItem() {
const editItemForm = useForm<EditableInventoryItem>({ const editItemForm = useForm<EditableInventoryItem>({
mode: 'uncontrolled', mode: 'uncontrolled',
initialValues: { initialValues: {
barcode: 0,
name: "", name: "",
brand: "", brand: "",
statusId: "", statusId: "",
@@ -90,7 +91,8 @@ function EditItem() {
<div>{isFetching ? 'Updating...' : ''}</div> <div>{isFetching ? 'Updating...' : ''}</div>
<Title order={1}>Edit Item</Title> <Title order={1}>Edit Item</Title>
<Text>ID: {data.id}</Text> <NumberInput withAsterisk size="md" key={editItemForm.key('barcode')} label="Barcode"
placeholder="Barcode" {...editItemForm.getInputProps('barcode')}/>
<TextInput withAsterisk key={editItemForm.key('brand')} size="md" label="Brand" <TextInput withAsterisk key={editItemForm.key('brand')} size="md" label="Brand"
placeholder="Brand" {...editItemForm.getInputProps('brand')}/> placeholder="Brand" {...editItemForm.getInputProps('brand')}/>
<TextInput withAsterisk key={editItemForm.key('name')} size="md" label="Name" <TextInput withAsterisk key={editItemForm.key('name')} size="md" label="Name"
@@ -46,7 +46,7 @@ function InventoryList() {
<Table striped> <Table striped>
<Table.Thead> <Table.Thead>
<Table.Tr> <Table.Tr>
<Table.Th c="red">ID</Table.Th> <Table.Th c="red">Barcode</Table.Th>
<Table.Th c="red">Brand</Table.Th> <Table.Th c="red">Brand</Table.Th>
<Table.Th c="red">Item</Table.Th> <Table.Th c="red">Item</Table.Th>
<Table.Th c="red">Status</Table.Th> <Table.Th c="red">Status</Table.Th>
@@ -56,7 +56,7 @@ function InventoryList() {
<Table.Tbody> <Table.Tbody>
{data.map((data) => ( {data.map((data) => (
<Table.Tr key={data.id}> <Table.Tr key={data.id}>
<Table.Td>{data.id}</Table.Td> <Table.Td>{data.barcode}</Table.Td>
<Table.Td>{data.brand}</Table.Td> <Table.Td>{data.brand}</Table.Td>
<Table.Td>{data.name}</Table.Td> <Table.Td>{data.name}</Table.Td>
<Table.Td>{data.statusId}</Table.Td> <Table.Td>{data.statusId}</Table.Td>
@@ -29,7 +29,7 @@ function ItemDetail() {
<Container m="lg"> <Container m="lg">
<Title order={1}>Item Detail</Title> <Title order={1}>Item Detail</Title>
<div>{isFetching ? 'Updating...' : ''}</div> <div>{isFetching ? 'Updating...' : ''}</div>
<Text>ID: {data.id}</Text> <Text>Barcode: {data.barcode}</Text>
<Text>Brand: {data.brand}</Text> <Text>Brand: {data.brand}</Text>
<Text>Name: {data.name}</Text> <Text>Name: {data.name}</Text>
<Text>Status: {data.status.name}</Text> <Text>Status: {data.status.name}</Text>
@@ -1,5 +1,6 @@
export interface InventoryItem { export interface InventoryItem {
id: number, id: number,
barcode: number,
brand: string, brand: string,
name: string, name: string,
status: {id: string; name: string}, status: {id: string; name: string},