diff --git a/01-frontend/src/helper/adminpanel/ItemsInfo.tsx b/01-frontend/src/helper/adminpanel/ItemsInfo.tsx index 953f457..380be05 100644 --- a/01-frontend/src/helper/adminpanel/ItemsInfo.tsx +++ b/01-frontend/src/helper/adminpanel/ItemsInfo.tsx @@ -3,13 +3,13 @@ import EditIcon from "@mui/icons-material/Edit"; import { Box, Button, IconButton, Toolbar, useTheme } from "@mui/material"; import { Gauge, gaugeClasses } from "@mui/x-charts"; import { DataGrid, GridColDef, GridRowId, GridRowSelectionModel } from "@mui/x-data-grid"; -import { useQuery } from "@tanstack/react-query"; +import { useMutation, useQuery } from "@tanstack/react-query"; import { useEffect, useState } from "react"; import { useTranslation } from "react-i18next"; import Item from "../../components/Item"; import { mapValueToColor } from "../../util/ColorUtil.tsx"; import { useAccount } from "../AccountProvider.tsx"; -import { fetchItems } from "../query/Queries.tsx"; +import { deleteItemQuery, fetchItems } from "../query/Queries.tsx"; import ItemImageDialog from "./ItemImageDialog.tsx"; import NewItemDialog from "./NewItemDialog.tsx"; @@ -65,11 +65,17 @@ export default function ItemsInfo() { setSelectedRows(newSelection.ids); }; + const deleteItem = useMutation({ + mutationFn: (uuid: string) => + deleteItemQuery(uuid), + }); + const handleDeleteSelected = async () => { - selectedRows.forEach((row) => { - //TODO: send delete command, or send deleteall - console.log(row); - }) + await Promise.all( + Array.from(selectedRows).map(async (row) => { + await deleteItem.mutateAsync(rows.find(item => item.id === row)?.uuid || ""); + }) + ); setRows(rows.filter((row) => !selectedRows.has(row.id))); }; diff --git a/01-frontend/src/helper/adminpanel/NewItemDialog.tsx b/01-frontend/src/helper/adminpanel/NewItemDialog.tsx index ea2413a..9571dbf 100644 --- a/01-frontend/src/helper/adminpanel/NewItemDialog.tsx +++ b/01-frontend/src/helper/adminpanel/NewItemDialog.tsx @@ -1,6 +1,5 @@ import CloseIcon from '@mui/icons-material/Close'; -import CloudUploadIcon from '@mui/icons-material/CloudUpload'; import { Alert, Box, @@ -10,12 +9,13 @@ import { DialogContent, DialogTitle, IconButton, - TextField, - Typography + TextField } from '@mui/material'; +import { useMutation } from '@tanstack/react-query'; import { useState } from 'react'; import { useTranslation } from 'react-i18next'; import { Item } from '../../components/Item'; +import { submitItem } from '../query/Queries'; interface NewItemDialogProps { open: boolean; @@ -51,10 +51,20 @@ export default function NewItemDialog({ open, onClose }: NewItemDialogProps) { setItem({ ...item, [e.target.name]: e.target.value }); }; + const saveItem = useMutation({ + mutationFn: (item: Item) => + submitItem(item), + }); + const handleSave = async () => { setLoading(true); setError(null); setSuccess(false); + + await saveItem.mutateAsync(item) + + onClose(); // Close the dialog after saving + setLoading(false); }; return ( diff --git a/01-frontend/src/helper/query/Queries.tsx b/01-frontend/src/helper/query/Queries.tsx index 6f753f7..d0409ca 100644 --- a/01-frontend/src/helper/query/Queries.tsx +++ b/01-frontend/src/helper/query/Queries.tsx @@ -3,7 +3,7 @@ import AccountType, { AdminAccountOperation, CustomerType, SubmitLogin, User } from "../../components/Account"; import OrderType, { OrderPatch } from "../../components/Order"; import RatingSubmitType from "../../components/RatingSubmit"; -import { ItemWithFSImage } from "../../components/Item"; +import { Item, ItemWithFSImage } from "../../components/Item"; export const fetchItemList = async () => { const response = await fetch('http://localhost:8085/article/all'); @@ -273,3 +273,27 @@ export const fetchFarmingStationItemList = async (): Promise throw new Error('Failed to fetch items'); return response.json(); } + +export const submitItem = async (item: Item) => { + const response = await fetch("http://localhost:8085/article", { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify(item), + }); + if (!response.ok) { + throw new Error("Login failed"); + } + return response.json(); +}; + +export const deleteItemQuery = async (uuid: string) => { + const response = await fetch("http://localhost:8085/article?uuid=" + uuid, { + method: "DELETE" + }); + if (!response.ok) { + throw new Error("Login failed"); + } + return response.json(); +};