diff --git a/00-backend/datasource/database.sqlite b/00-backend/datasource/database.sqlite index 777889e..1270ede 100644 Binary files a/00-backend/datasource/database.sqlite and b/00-backend/datasource/database.sqlite differ diff --git a/01-frontend/src/helper/adminpanel/ItemsInfo.tsx b/01-frontend/src/helper/adminpanel/ItemsInfo.tsx index 6c6b6c4..cf447b8 100644 --- a/01-frontend/src/helper/adminpanel/ItemsInfo.tsx +++ b/01-frontend/src/helper/adminpanel/ItemsInfo.tsx @@ -1,21 +1,21 @@ import DeleteIcon from "@mui/icons-material/Delete"; 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 {useMutation, useQuery} from "@tanstack/react-query"; -import {useEffect, useState} from "react"; -import {useTranslation} from "react-i18next"; +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 { 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 {deleteItemQuery, fetchItems} from "../query/Queries.tsx"; +import { mapValueToColor } from "../../util/ColorUtil.tsx"; +import { useAccount } from "../AccountProvider.tsx"; +import { deleteItemQuery, fetchItems, updateItemAdmin } from "../query/Queries.tsx"; import ItemImageDialog from "./ItemImageDialog.tsx"; import NewItemDialog from "./NewItemDialog.tsx"; export default function ItemsInfo() { const theme = useTheme(); - const {t} = useTranslation(); + const { t } = useTranslation(); const [rows, setRows] = useState([]); const [selectedRows, setSelectedRows] = useState>(new Set()); @@ -45,9 +45,9 @@ export default function ItemsInfo() { setNewItemDialog(true); } - const {user: loginData} = useAccount(); + const { user: loginData } = useAccount(); - const {data} = useQuery({ + const { data } = useQuery({ queryKey: ["fetchItems", loginData], queryFn: () => fetchItems(), retry: 3, @@ -79,14 +79,26 @@ export default function ItemsInfo() { setRows(rows.filter((row) => !selectedRows.has(row.id))); }; + const updateItem = useMutation({ + mutationFn: (item: Item) => + updateItemAdmin(item), + + }); + + const handleRowUpdate = async (updatedRow: Item) => { + setRows(rows.map(row => row.id === updatedRow.id ? updatedRow : row)); + await updateItem.mutateAsync(updatedRow); + return updatedRow; + } + const columns: GridColDef<(typeof rows)[number]>[] = [ - {field: 'id', headerName: 'ID', width: 60}, + { field: 'id', headerName: 'ID', width: 60 }, { field: 'uuid', headerName: t('uuid'), type: "string", width: 120, - editable: true + editable: false }, { field: 'name', @@ -129,13 +141,13 @@ export default function ItemsInfo() { editable: true, type: 'number', renderCell: params => { - return mapValueToColor(0, params.row.stockExpected, params.row.stock) + valueMax={params.row.stockExpected} startAngle={-90} endAngle={90} sx={{ + [`& .${gaugeClasses.valueArc}`]: { + fill: () => { + return mapValueToColor(0, params.row.stockExpected, params.row.stock) + }, }, - }, - }} text={() => `${params.row.stock}`}/> + }} text={() => `${params.row.stock}`} /> }, { field: 'rating', @@ -144,13 +156,13 @@ export default function ItemsInfo() { editable: false, //the rating is averaged from ratings type: 'number', renderCell: params => { - return mapValueToColor(0, 10, params.row.rating) + startAngle={-90} endAngle={90} sx={{ + [`& .${gaugeClasses.valueArc}`]: { + fill: () => { + return mapValueToColor(0, 10, params.row.rating) + }, }, - }, - }} text={() => `${params.row.rating.toFixed(2)}`}/> + }} text={() => `${params.row.rating.toFixed(2)}`} /> }, { field: "actualPrice", @@ -164,14 +176,14 @@ export default function ItemsInfo() { headerName: t('images'), width: 90, editable: false, - renderCell: params => handleImageEdit(params.row)}> , + renderCell: params => handleImageEdit(params.row)}> , }, { field: 'farmImage', headerName: t('fsImage'), width: 90, editable: false, - renderCell: params => handleFarmImageEdit(params.row)}> + renderCell: params => handleFarmImageEdit(params.row)}> , } ]; @@ -197,7 +209,7 @@ export default function ItemsInfo() {