Refactor loan and user management components and backend routes

- Updated LoanTable component to fetch loan data from new API endpoint and display notes.
- Enhanced UserTable component to include additional user fields (first name, last name, email, admin status) and updated input handling.
- Modified fetcher utility to use new user data API endpoint.
- Adjusted login functionality to point to the new admin login endpoint and handle unauthorized access.
- Refactored user actions utility to align with updated API endpoints for user management.
- Updated backend routes for user and loan data management to reflect new structure and naming conventions.
- Revised SQL schema and mock data to accommodate new fields and constraints.
- Changed Docker configuration to use the new database name.
This commit is contained in:
2025-11-11 17:08:45 +01:00
parent 974a5a75d8
commit a8b4ac3d60
26 changed files with 605 additions and 347 deletions

View File

@@ -10,6 +10,7 @@ import {
HStack,
IconButton,
Heading,
Switch, // neu
} from "@chakra-ui/react";
import { Tooltip } from "@/components/ui/tooltip";
import { fetchUserData } from "@/utils/fetcher";
@@ -23,9 +24,13 @@ import ChangePWform from "./ChangePWform";
type User = {
id: number;
username: string;
password: string;
role: string;
first_name: string;
last_name: string;
email: string;
is_admin: boolean;
role: number;
entry_created_at: string;
entry_updated_at: string;
};
const UserTable: React.FC = () => {
@@ -52,10 +57,20 @@ const UserTable: React.FC = () => {
setIsError(true);
};
const handleInputChange = (userId: number, field: string, value: string) => {
const handleInputChange = (userId: number, field: string, value: any) => {
setUsers((prevUsers) =>
prevUsers.map((user) =>
user.id === userId ? { ...user, [field]: value } : user
user.id === userId
? {
...user,
[field]:
field === "role"
? Number(value)
: field === "is_admin"
? value === true || value === "true" || value === 1
: value,
}
: user
)
);
};
@@ -70,7 +85,7 @@ const UserTable: React.FC = () => {
setIsLoading(true);
try {
const data = await fetchUserData();
console.log("user api response", data);
console.log(data);
if (Array.isArray(data)) {
setUsers(data);
} else {
@@ -189,6 +204,18 @@ const UserTable: React.FC = () => {
<Table.ColumnHeader>
<strong>Benutzername</strong>
</Table.ColumnHeader>
<Table.ColumnHeader>
<strong>Vorname</strong>
</Table.ColumnHeader>
<Table.ColumnHeader>
<strong>Nachname</strong>
</Table.ColumnHeader>
<Table.ColumnHeader>
<strong>E-Mail</strong>
</Table.ColumnHeader>
<Table.ColumnHeader>
<strong>Admin</strong>
</Table.ColumnHeader>
<Table.ColumnHeader>
<strong>Passwort ändern</strong>
</Table.ColumnHeader>
@@ -198,6 +225,9 @@ const UserTable: React.FC = () => {
<Table.ColumnHeader>
<strong>Eintrag erstellt am</strong>
</Table.ColumnHeader>
<Table.ColumnHeader>
<strong>Eintrag aktualisiert am</strong>
</Table.ColumnHeader>
<Table.ColumnHeader>
<strong>Aktionen</strong>
</Table.ColumnHeader>
@@ -207,14 +237,58 @@ const UserTable: React.FC = () => {
{users.map((user) => (
<Table.Row key={user.id}>
<Table.Cell>{user.id}</Table.Cell>
<Table.Cell>{user.username}</Table.Cell>
{/* Vorname */}
<Table.Cell>
<Input
size="sm"
value={user.first_name ?? ""}
onChange={(e) =>
handleInputChange(user.id, "username", e.target.value)
handleInputChange(user.id, "first_name", e.target.value)
}
value={user.username}
/>
</Table.Cell>
{/* Nachname */}
<Table.Cell>
<Input
size="sm"
value={user.last_name ?? ""}
onChange={(e) =>
handleInputChange(user.id, "last_name", e.target.value)
}
/>
</Table.Cell>
{/* E-Mail */}
<Table.Cell>
<Input
type="email"
size="sm"
value={user.email ?? ""}
onChange={(e) =>
handleInputChange(user.id, "email", e.target.value)
}
/>
</Table.Cell>
{/* Admin */}
<Table.Cell>
<Switch.Root
size="sm"
checked={!!user.is_admin}
onCheckedChange={(details) =>
handleInputChange(user.id, "is_admin", details.checked)
}
aria-label="Adminrechte umschalten"
>
<Switch.Control>
<Switch.Thumb />
</Switch.Control>
<Switch.HiddenInput />
</Switch.Root>
</Table.Cell>
<Table.Cell>
<Button onClick={() => handlePasswordChange(user.username)}>
Passwort ändern
@@ -230,13 +304,17 @@ const UserTable: React.FC = () => {
/>
</Table.Cell>
<Table.Cell>{formatDateTime(user.entry_created_at)}</Table.Cell>
<Table.Cell>{formatDateTime(user.entry_updated_at)}</Table.Cell>
<Table.Cell>
<Button
onClick={() =>
handleEdit(
user.id,
user.username,
user.role,
user.first_name,
user.last_name,
user.email,
user.is_admin,
Number(user.role)
).then((response) => {
if (response.success) {
setError(