Add useQuery to ADmin Account page

This commit is contained in:
FlorianSpeicher
2025-06-15 15:42:18 +02:00
parent 3ccf5357ce
commit 60dcec4cba
4 changed files with 40 additions and 100 deletions

View File

@@ -31,10 +31,16 @@ export type SubmitLogin = {
password: string;
};
export type SubmitLoginSession = {
email: string;
session: string;
};
export type User = {
password: string;
email: string;
customerId: number;
session: string;
// weitere Felder nach Bedarf
};

View File

@@ -4,7 +4,10 @@ import {Box, Button, IconButton, Toolbar, useTheme} from "@mui/material";
import AccountType from "../../components/Account";
import {useTranslation} from "react-i18next";
import {DataGrid, GridColDef, GridRowId, GridRowSelectionModel} from "@mui/x-data-grid";
import {useState} from "react";
import {useEffect, useState} from "react";
import { useQuery } from "@tanstack/react-query";
import { fetchAccounts } from "../query/Queries";
import { useAccount } from "../AccountProvider";
export default function AccountsInfo() {
const theme = useTheme();
@@ -15,100 +18,6 @@ export default function AccountsInfo() {
console.log("CustomerEdit", account);
}
const _rows: AccountType[] = [
{
id: 1,
customer: {id: 0, name: 'Big', surname: 'Smoke', address: "Grove Str", country: "USA", zip: "66424"},
langI18n: "en",
admin: false,
email: "smoke@trainwatchers.com",
password: "$1$s11alt$h111ash"
},
{
id: 2,
customer: {id: 0, name: 'C', surname: 'J', address: "Grove Str", country: "USA", zip: "66424"},
langI18n: "en",
admin: true,
email: "cj@grv.gov",
password: "$1$salt$hash"
},
{
id: 3,
customer: {
id: 0,
name: 'Flo',
surname: 'Rian',
address: "Weihbachstreet 555",
country: "Germany",
zip: "66424"
},
langI18n: "de",
admin: false,
email: "flo@ryan",
password: "$1$salt$hash"
},
{
id: 41,
customer: {
id: 0,
name: 'Tim',
surname: 'Wand',
address: "Wandstraße 12",
country: "Deutschland",
zip: "66420"
},
langI18n: "de",
admin: true,
email: "management@shitposting.eu",
password: "$5$sa23123lt$has21212h"
},
{
id: 15,
customer: {
id: 0,
name: 'Lia',
surname: 'Shaprius',
address: "Malstatter Str 18",
country: "Saarbrooklyn",
zip: "66117"
},
langI18n: "de",
admin: false,
email: "lia.prius@outlook.de",
password: "$1$salt$hash"
},
{
id: 17,
customer: {
id: 0,
name: 'Mathu-san',
surname: 'Saravanpavan',
address: "Solarbro-Alee",
country: "Deutschland",
zip: "66000"
},
langI18n: "de",
admin: false,
email: "mathusan@bro.de",
password: "$12$salt12$hash123"
},
{
id: 81,
customer: {id: 0, name: 'C', surname: 'J', address: "Grove Str", country: "USA", zip: "66424"},
langI18n: "en",
admin: false,
email: "flo@ryan",
password: "$1$salt$hash"
},
{
id: 19,
customer: {id: 0, name: 'C', surname: 'J', address: "Grove Str", country: "USA", zip: "66424"},
langI18n: "en",
admin: false,
email: "flo@ryan",
password: "$1$salt$hash"
},
]
/*
for testing purposes
for (let i = 0; i < 100; i++) {
@@ -117,9 +26,24 @@ export default function AccountsInfo() {
* */
//TODO: get per REST
const [rows, setRows] = useState<AccountType[]>(_rows);
const [rows, setRows] = useState<AccountType[]>([]);
const [selectedRows, setSelectedRows] = useState<Set<GridRowId>>(new Set());
const {user: loginData} = useAccount();
const { data } = useQuery({
queryKey: ["fetchAccounts", loginData],
queryFn: () => fetchAccounts(loginData? loginData : {email: "", password: "", session: "", customerId: -1}),
retry: 3,
retryDelay: 1000,
});
useEffect(() => {
if (data) {
setRows(data);
}
}, [data]);
const handleSelectionChange = (newSelection: GridRowSelectionModel) => {
setSelectedRows(newSelection.ids);
};

View File

@@ -2,7 +2,7 @@ import { Box, Button, Dialog, DialogActions, DialogContent, DialogTitle, Link, T
import { useQuery } from "@tanstack/react-query";
import i18next from "i18next";
import React, { useEffect, useState } from "react";
import AccountType from "../../components/Account";
import AccountType, { User } from "../../components/Account";
import { useAccount } from "../AccountProvider";
import { fetchAccount, submitLogin, submitRegister } from "../query/Queries"; // Importiere die Funktion für die Registrierung
@@ -63,11 +63,13 @@ const LoginDialog: React.FC<LoginDialogProps> = ({ open, onClose, loginData, set
setShowErrorLogin(false); // Fehlermeldung zurücksetzen
const response = await refetchLogin(); // Anfrage auslösen
if (response.status === "success") {
const session = response.data.uuid; // Session-Daten aus der Antwort extrahieren
const customerData = (await refetchAccount()).data;
const user = {
const user: User = {
email: customerData.email,
password: customerData.password,
customerId: customerData.customer.id, // Setze die customerId aus den Account-Daten
session: session, // Setze die Session aus der Login-Antwort
};
login(user);
setShowRegister(false); // Zurück zum Login wechseln

View File

@@ -1,6 +1,6 @@
// api/queries.js
import AccountType, { CustomerType, SubmitLogin } from "../../components/Account";
import AccountType, { CustomerType, SubmitLogin, User } from "../../components/Account";
import { SubmitOrder } from "../../components/Order";
import RatingSubmitType from "../../components/RatingSubmit";
@@ -26,7 +26,7 @@ export const submitRating = async (ratingData: RatingSubmitType) => {
throw new Error('Fehler beim Senden der Bewertung');
}
const data = await response.json();
const data = await response.json();
return data;
}
@@ -149,4 +149,12 @@ export const fetchOrders = async (customerId: number) => {
}
const data = await response.json();
return data;
};
export const fetchAccounts = async (loginData: User) => {
const response = await fetch("http://localhost:8085/account/all?email=" + loginData.email + "&session=" + loginData.session);
if (!response.ok) {
throw new Error("Login failed");
}
return response.json();
};