Compare commits
61 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 0cafaea487 | |||
| 9e0b2d3861 | |||
| 1e727427f2 | |||
| fdb54b832b | |||
| 2dede62e37 | |||
| 2cc5545ea8 | |||
| f8e29dca10 | |||
| e52fc13da4 | |||
| 55c44cc639 | |||
| 34f133f94c | |||
| a3df8172e2 | |||
| 98834a9270 | |||
| c00f720af4 | |||
| 8d04465705 | |||
| 06cb298a38 | |||
| 8589971dc8 | |||
| 6ec8e19737 | |||
| d29c793b6b | |||
| 9f44a4796d | |||
| c97cc8b538 | |||
| dc0a68f7f1 | |||
| fe3a06e5ce | |||
| 776fab749d | |||
| 179f5686d1 | |||
| 83b43f4c83 | |||
| 5d9cee63ab | |||
| 0b203d838c | |||
| ae1888fe90 | |||
| f1c02910e6 | |||
| d33b288956 | |||
| 5e2a426401 | |||
| 022aa669e8 | |||
| 28373e0231 | |||
| 2f3583ccd0 | |||
| 9da72cc5bf | |||
| c633627b7c | |||
| 5259c41b13 | |||
| 3d9e3814fe | |||
| b44edb2b1d | |||
| a72fabc0a0 | |||
| 1406f28f86 | |||
| 38d1091e9b | |||
| f82efecb8c | |||
| 1f12bc8839 | |||
| f19750f6f3 | |||
| 808b3fd5c4 | |||
| 0891598eb9 | |||
| 39ff02f2e7 | |||
| cc67fb4f85 | |||
| 75ff4aadc1 | |||
| 6f998d07c1 | |||
| f2bb326040 | |||
| 8c701db900 | |||
| d1664338a6 | |||
| 1a2624cd9e | |||
| a138190cc6 | |||
| 993e0cd74b | |||
| dab004a7b6 | |||
| d039336f39 | |||
| 4c781e9325 | |||
| 451e6b3646 |
@@ -14,7 +14,7 @@ server {
|
|||||||
}
|
}
|
||||||
|
|
||||||
location /backend/ {
|
location /backend/ {
|
||||||
proxy_pass http://borrow_system-backend_v2:8004/;
|
proxy_pass http://demo_borrow_system-backend_v2:8004/;
|
||||||
}
|
}
|
||||||
|
|
||||||
location ~* \.(?:js|mjs|css|png|jpg|jpeg|gif|ico|svg|woff2?)$ {
|
location ~* \.(?:js|mjs|css|png|jpg|jpeg|gif|ico|svg|woff2?)$ {
|
||||||
|
|||||||
@@ -16,7 +16,6 @@ import { Flex } from "@chakra-ui/react";
|
|||||||
import { Footer } from "./components/footer/Footer";
|
import { Footer } from "./components/footer/Footer";
|
||||||
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
||||||
import { API_BASE } from "@/config/api.config";
|
import { API_BASE } from "@/config/api.config";
|
||||||
import { ContactPage } from "./pages/ContactPage";
|
|
||||||
|
|
||||||
const queryClient = new QueryClient();
|
const queryClient = new QueryClient();
|
||||||
|
|
||||||
@@ -81,7 +80,6 @@ function App() {
|
|||||||
<Route path="/" element={<HomePage />} />
|
<Route path="/" element={<HomePage />} />
|
||||||
<Route path="/my-loans" element={<MyLoansPage />} />
|
<Route path="/my-loans" element={<MyLoansPage />} />
|
||||||
<Route path="/landingpage" element={<Landingpage />} />
|
<Route path="/landingpage" element={<Landingpage />} />
|
||||||
<Route path="/contact" element={<ContactPage />} />
|
|
||||||
</Route>
|
</Route>
|
||||||
|
|
||||||
<Route path="/login" element={<LoginPage />} />
|
<Route path="/login" element={<LoginPage />} />
|
||||||
|
|||||||
@@ -23,7 +23,6 @@ import {
|
|||||||
MoreVertical,
|
MoreVertical,
|
||||||
Languages,
|
Languages,
|
||||||
Table,
|
Table,
|
||||||
ContactRound,
|
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
import { useUserContext } from "@/states/Context";
|
import { useUserContext } from "@/states/Context";
|
||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
@@ -156,16 +155,6 @@ export const Header = () => {
|
|||||||
</HStack>
|
</HStack>
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
<Menu.Item
|
|
||||||
value="contact"
|
|
||||||
onSelect={() => navigate("/contact", { replace: true })}
|
|
||||||
children={
|
|
||||||
<HStack gap={3}>
|
|
||||||
<ContactRound size={16} />
|
|
||||||
<Text as="span">{t("contact")}</Text>
|
|
||||||
</HStack>
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
<Menu.Separator />
|
<Menu.Separator />
|
||||||
<Menu.Item
|
<Menu.Item
|
||||||
value="logout"
|
value="logout"
|
||||||
@@ -298,17 +287,6 @@ export const Header = () => {
|
|||||||
</HStack>
|
</HStack>
|
||||||
</Button>
|
</Button>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<Button
|
|
||||||
variant={"outline"}
|
|
||||||
onClick={() => navigate("/contact", { replace: true })}
|
|
||||||
>
|
|
||||||
<HStack gap={2}>
|
|
||||||
<ContactRound size={18} />
|
|
||||||
<Text as="span">{t("contact")}</Text>
|
|
||||||
</HStack>
|
|
||||||
</Button>
|
|
||||||
|
|
||||||
<Button onClick={logout} variant="outline" colorScheme="red">
|
<Button onClick={logout} variant="outline" colorScheme="red">
|
||||||
<HStack gap={2}>
|
<HStack gap={2}>
|
||||||
<LogOut size={18} />
|
<LogOut size={18} />
|
||||||
|
|||||||
@@ -1,15 +1,23 @@
|
|||||||
"use client"
|
"use client";
|
||||||
|
|
||||||
import { ChakraProvider, defaultSystem } from "@chakra-ui/react"
|
import { ChakraProvider, defaultSystem } from "@chakra-ui/react";
|
||||||
import {
|
import * as React from "react";
|
||||||
ColorModeProvider,
|
import type { ReactNode } from "react";
|
||||||
type ColorModeProviderProps,
|
import { ColorModeProvider as ThemeColorModeProvider } from "./color-mode";
|
||||||
} from "./color-mode"
|
|
||||||
|
|
||||||
export function Provider(props: ColorModeProviderProps) {
|
export interface ColorModeProviderProps {
|
||||||
|
children: React.ReactNode;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function ColorModeProvider({ children }: ColorModeProviderProps) {
|
||||||
|
// Wrap children with the real color-mode provider
|
||||||
|
return <ThemeColorModeProvider>{children}</ThemeColorModeProvider>;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function Provider({ children }: { children: ReactNode }) {
|
||||||
return (
|
return (
|
||||||
<ChakraProvider value={defaultSystem}>
|
<ChakraProvider value={defaultSystem}>
|
||||||
<ColorModeProvider {...props} />
|
<ColorModeProvider>{children}</ColorModeProvider>
|
||||||
</ChakraProvider>
|
</ChakraProvider>
|
||||||
)
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,111 +0,0 @@
|
|||||||
import {
|
|
||||||
Field,
|
|
||||||
Textarea,
|
|
||||||
Button,
|
|
||||||
Alert,
|
|
||||||
Container,
|
|
||||||
Text,
|
|
||||||
VStack,
|
|
||||||
Spinner,
|
|
||||||
} from "@chakra-ui/react";
|
|
||||||
import { useTranslation } from "react-i18next";
|
|
||||||
import { useState } from "react";
|
|
||||||
import { API_BASE } from "@/config/api.config";
|
|
||||||
import Cookies from "js-cookie";
|
|
||||||
import { Header } from "@/components/Header";
|
|
||||||
|
|
||||||
interface Alert {
|
|
||||||
type: "info" | "warning" | "success" | "error" | "neutral";
|
|
||||||
headline: string;
|
|
||||||
text: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const ContactPage = () => {
|
|
||||||
const { t } = useTranslation();
|
|
||||||
const [message, setMessage] = useState("");
|
|
||||||
const [isSending, setIsSending] = useState(false);
|
|
||||||
const [alert, setAlert] = useState<Alert | null>(null);
|
|
||||||
|
|
||||||
const sendMessage = async () => {
|
|
||||||
setIsSending(true);
|
|
||||||
if (message.trim() === "") {
|
|
||||||
setAlert({
|
|
||||||
type: "error",
|
|
||||||
headline: t("contactPage_messageErrorHeadline"),
|
|
||||||
text: t("contactPage_messageErrorText2"),
|
|
||||||
});
|
|
||||||
setIsSending(false);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Logic to send the message
|
|
||||||
const result = await fetch(`${API_BASE}/api/users/contact`, {
|
|
||||||
method: "POST",
|
|
||||||
headers: {
|
|
||||||
Authorization: `Bearer ${Cookies.get("token") || ""}`,
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
Accept: "application/json",
|
|
||||||
},
|
|
||||||
body: JSON.stringify({ message }),
|
|
||||||
});
|
|
||||||
|
|
||||||
if (result.ok) {
|
|
||||||
setAlert({
|
|
||||||
type: "success",
|
|
||||||
headline: t("contactPage_successHeadline"),
|
|
||||||
text: t("contactPage_successText"),
|
|
||||||
});
|
|
||||||
setMessage("");
|
|
||||||
} else if (result.status === 503) {
|
|
||||||
setAlert({
|
|
||||||
type: "error",
|
|
||||||
headline: t("serviceDeactivatedHeadline"),
|
|
||||||
text: t("contactPage_serviceDeactivatedText"),
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
setAlert({
|
|
||||||
type: "error",
|
|
||||||
headline: t("contactPage_errorHeadline"),
|
|
||||||
text: t("contactPage_errorText"),
|
|
||||||
});
|
|
||||||
}
|
|
||||||
setIsSending(false);
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Container className="px-6 sm:px-8 pt-10">
|
|
||||||
<Header />
|
|
||||||
<Field.Root invalid={message === ""}>
|
|
||||||
<Field.Label>
|
|
||||||
<Text>{t("contactPage_messageDescription")}</Text>
|
|
||||||
<Field.RequiredIndicator />
|
|
||||||
</Field.Label>
|
|
||||||
<Textarea
|
|
||||||
placeholder={t("contactPage_messagePlaceholder")}
|
|
||||||
variant="subtle"
|
|
||||||
value={message}
|
|
||||||
onChange={(e) => setMessage(e.target.value)}
|
|
||||||
/>
|
|
||||||
{message === "" && (
|
|
||||||
<Field.ErrorText>{t("contactPage_messageErrorText")}</Field.ErrorText>
|
|
||||||
)}
|
|
||||||
</Field.Root>
|
|
||||||
{alert && (
|
|
||||||
<Alert.Root status={alert.type}>
|
|
||||||
<Alert.Indicator />
|
|
||||||
<Alert.Content>
|
|
||||||
<Alert.Title>{alert.headline}</Alert.Title>
|
|
||||||
<Alert.Description>{alert.text}</Alert.Description>
|
|
||||||
</Alert.Content>
|
|
||||||
</Alert.Root>
|
|
||||||
)}
|
|
||||||
{isSending && (
|
|
||||||
<VStack colorPalette="teal">
|
|
||||||
<Spinner color="colorPalette.600" />
|
|
||||||
<Text color="colorPalette.600">{t("loading")}</Text>
|
|
||||||
</VStack>
|
|
||||||
)}
|
|
||||||
<Button onClick={sendMessage}>{t("contactPage_sendButton")}</Button>
|
|
||||||
</Container>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
@@ -68,7 +68,7 @@
|
|||||||
"admin-status": "Admin-Status",
|
"admin-status": "Admin-Status",
|
||||||
"first-name": "Vorname",
|
"first-name": "Vorname",
|
||||||
"last-name": "Nachname",
|
"last-name": "Nachname",
|
||||||
"app-title": "Ausleihsystem",
|
"app-title": "Ausleihsystem (demo)",
|
||||||
"last-borrowed-person": "Zuletzt ausgeliehen von",
|
"last-borrowed-person": "Zuletzt ausgeliehen von",
|
||||||
"currently-borrowed-by": "Derzeit ausgeliehen von",
|
"currently-borrowed-by": "Derzeit ausgeliehen von",
|
||||||
"back": "Zurückgehen",
|
"back": "Zurückgehen",
|
||||||
|
|||||||
@@ -68,7 +68,7 @@
|
|||||||
"admin-status": "Admin status",
|
"admin-status": "Admin status",
|
||||||
"first-name": "First name",
|
"first-name": "First name",
|
||||||
"last-name": "Last name",
|
"last-name": "Last name",
|
||||||
"app-title": "Borrow System",
|
"app-title": "Borrow System (demo)",
|
||||||
"last-borrowed-person": "Last borrowed by",
|
"last-borrowed-person": "Last borrowed by",
|
||||||
"currently-borrowed-by": "Currently borrowed by",
|
"currently-borrowed-by": "Currently borrowed by",
|
||||||
"back": "Go back",
|
"back": "Go back",
|
||||||
|
|||||||
@@ -1,16 +1,23 @@
|
|||||||
import { defineConfig } from "vite";
|
import { defineConfig } from "vite";
|
||||||
import react from "@vitejs/plugin-react";
|
|
||||||
import svgr from "vite-plugin-svgr";
|
|
||||||
import tailwindcss from "@tailwindcss/vite";
|
import tailwindcss from "@tailwindcss/vite";
|
||||||
import tsconfigPaths from "vite-tsconfig-paths";
|
import path from "node:path";
|
||||||
|
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
plugins: [react(), svgr(), tailwindcss(), tsconfigPaths()],
|
plugins: [tailwindcss()],
|
||||||
|
resolve: {
|
||||||
|
alias: {
|
||||||
|
"@": path.resolve(__dirname, "src"),
|
||||||
|
},
|
||||||
|
},
|
||||||
server: {
|
server: {
|
||||||
host: "0.0.0.0",
|
host: "0.0.0.0",
|
||||||
port: 8001,
|
allowedHosts: ["insta.the1s.de"],
|
||||||
watch: {
|
port: 8101,
|
||||||
usePolling: true,
|
watch: { usePolling: true },
|
||||||
|
hmr: {
|
||||||
|
host: "insta.the1s.de",
|
||||||
|
port: 8101,
|
||||||
|
protocol: "wss",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|||||||
+1
-1
@@ -14,7 +14,7 @@ server {
|
|||||||
}
|
}
|
||||||
|
|
||||||
location /backend/ {
|
location /backend/ {
|
||||||
proxy_pass http://borrow_system-backend_v2:8004/;
|
proxy_pass http://demo_borrow_system-backend_v2:8102/;
|
||||||
}
|
}
|
||||||
|
|
||||||
location ~* \.(?:js|mjs|css|png|jpg|jpeg|gif|ico|svg|woff2?)$ {
|
location ~* \.(?:js|mjs|css|png|jpg|jpeg|gif|ico|svg|woff2?)$ {
|
||||||
|
|||||||
@@ -47,7 +47,7 @@ const Dashboard: React.FC<DashboardProps> = ({ onLogout }) => {
|
|||||||
viewAPI={() => setActiveView("API")}
|
viewAPI={() => setActiveView("API")}
|
||||||
viewConfig={() => setActiveView("Server Konfiguration")}
|
viewConfig={() => setActiveView("Server Konfiguration")}
|
||||||
/>
|
/>
|
||||||
<Box flex="1" display="flex" flexDirection="column">
|
<Box flex="1" display="flex" flexDirection="column" minH={0}>
|
||||||
<Flex
|
<Flex
|
||||||
as="header"
|
as="header"
|
||||||
align="center"
|
align="center"
|
||||||
@@ -68,7 +68,7 @@ const Dashboard: React.FC<DashboardProps> = ({ onLogout }) => {
|
|||||||
</Button>
|
</Button>
|
||||||
</Flex>
|
</Flex>
|
||||||
</Flex>
|
</Flex>
|
||||||
<Box as="main" flex="1" p={6}>
|
<Box as="main" flex="1" p={6} minH={0} overflow="hidden">
|
||||||
{activeView === "" && (
|
{activeView === "" && (
|
||||||
<Flex
|
<Flex
|
||||||
align="center"
|
align="center"
|
||||||
|
|||||||
@@ -57,32 +57,32 @@ const ItemTable: React.FC = () => {
|
|||||||
|
|
||||||
const handleItemNameChange = (id: number, value: string) => {
|
const handleItemNameChange = (id: number, value: string) => {
|
||||||
setItems((prev) =>
|
setItems((prev) =>
|
||||||
prev.map((it) => (it.id === id ? { ...it, item_name: value } : it))
|
prev.map((it) => (it.id === id ? { ...it, item_name: value } : it)),
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleCanBorrowRoleChange = (id: number, value: string) => {
|
const handleCanBorrowRoleChange = (id: number, value: string) => {
|
||||||
setItems((prev) =>
|
setItems((prev) =>
|
||||||
prev.map((it) => (it.id === id ? { ...it, can_borrow_role: value } : it))
|
prev.map((it) => (it.id === id ? { ...it, can_borrow_role: value } : it)),
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleLockerNumberChange = (id: number, value: string) => {
|
const handleLockerNumberChange = (id: number, value: string) => {
|
||||||
setItems((prev) =>
|
setItems((prev) =>
|
||||||
prev.map((it) => (it.id === id ? { ...it, safe_nr: value } : it))
|
prev.map((it) => (it.id === id ? { ...it, safe_nr: value } : it)),
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleDoorKeyChange = (id: number, value: string) => {
|
const handleDoorKeyChange = (id: number, value: string) => {
|
||||||
setItems((prev) =>
|
setItems((prev) =>
|
||||||
prev.map((it) => (it.id === id ? { ...it, door_key: value } : it))
|
prev.map((it) => (it.id === id ? { ...it, door_key: value } : it)),
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const setError = (
|
const setError = (
|
||||||
status: "error" | "success",
|
status: "error" | "success",
|
||||||
message: string,
|
message: string,
|
||||||
description: string
|
description: string,
|
||||||
) => {
|
) => {
|
||||||
setIsError(false);
|
setIsError(false);
|
||||||
setErrorStatus(status);
|
setErrorStatus(status);
|
||||||
@@ -102,7 +102,7 @@ const ItemTable: React.FC = () => {
|
|||||||
headers: {
|
headers: {
|
||||||
Authorization: `Bearer ${Cookies.get("token")}`,
|
Authorization: `Bearer ${Cookies.get("token")}`,
|
||||||
},
|
},
|
||||||
}
|
},
|
||||||
);
|
);
|
||||||
const data = await response.json();
|
const data = await response.json();
|
||||||
return data;
|
return data;
|
||||||
@@ -193,11 +193,50 @@ const ItemTable: React.FC = () => {
|
|||||||
|
|
||||||
{/* make table fill available width, like UserTable */}
|
{/* make table fill available width, like UserTable */}
|
||||||
{!isLoading && (
|
{!isLoading && (
|
||||||
|
<Table.ScrollArea flex="1" minH={0} rounded="md" mt={4}>
|
||||||
<Table.Root
|
<Table.Root
|
||||||
size="sm"
|
size="sm"
|
||||||
striped
|
striped
|
||||||
w="100%"
|
stickyHeader
|
||||||
style={{ tableLayout: "auto" }} // Spalten nach Content
|
css={{
|
||||||
|
"& [data-sticky]": {
|
||||||
|
position: "sticky",
|
||||||
|
zIndex: 1,
|
||||||
|
bg: "bg",
|
||||||
|
|
||||||
|
_after: {
|
||||||
|
content: '""',
|
||||||
|
position: "absolute",
|
||||||
|
pointerEvents: "none",
|
||||||
|
top: "0",
|
||||||
|
bottom: "-1px",
|
||||||
|
width: "32px",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
"& [data-sticky=end]": {
|
||||||
|
_after: {
|
||||||
|
insetInlineEnd: "0",
|
||||||
|
translate: "100% 0",
|
||||||
|
shadow: "inset 8px 0px 8px -8px rgba(0, 0, 0, 0.16)",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
"& [data-sticky=start]": {
|
||||||
|
_after: {
|
||||||
|
insetInlineStart: "0",
|
||||||
|
translate: "-100% 0",
|
||||||
|
shadow: "inset -8px 0px 8px -8px rgba(0, 0, 0, 0.16)",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
"& thead tr": {
|
||||||
|
shadow: "0 1px 0 0 {colors.border}",
|
||||||
|
"&:has(th[data-sticky])": {
|
||||||
|
zIndex: 2,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
<Table.Header>
|
<Table.Header>
|
||||||
<Table.Row>
|
<Table.Row>
|
||||||
@@ -315,8 +354,12 @@ const ItemTable: React.FC = () => {
|
|||||||
value={item.door_key}
|
value={item.door_key}
|
||||||
/>
|
/>
|
||||||
</Table.Cell>
|
</Table.Cell>
|
||||||
<Table.Cell>{formatDateTime(item.entry_created_at)}</Table.Cell>
|
<Table.Cell>
|
||||||
<Table.Cell>{formatDateTime(item.entry_updated_at)}</Table.Cell>
|
{formatDateTime(item.entry_created_at)}
|
||||||
|
</Table.Cell>
|
||||||
|
<Table.Cell>
|
||||||
|
{formatDateTime(item.entry_updated_at)}
|
||||||
|
</Table.Cell>
|
||||||
<Table.Cell>{item.last_borrowed_person}</Table.Cell>
|
<Table.Cell>{item.last_borrowed_person}</Table.Cell>
|
||||||
<Table.Cell>{item.currently_borrowing}</Table.Cell>
|
<Table.Cell>{item.currently_borrowing}</Table.Cell>
|
||||||
<Table.Cell whiteSpace="nowrap">
|
<Table.Cell whiteSpace="nowrap">
|
||||||
@@ -327,7 +370,7 @@ const ItemTable: React.FC = () => {
|
|||||||
item.item_name,
|
item.item_name,
|
||||||
item.safe_nr,
|
item.safe_nr,
|
||||||
item.door_key,
|
item.door_key,
|
||||||
item.can_borrow_role
|
item.can_borrow_role,
|
||||||
).then((response) => {
|
).then((response) => {
|
||||||
if (response.success) {
|
if (response.success) {
|
||||||
setError(
|
setError(
|
||||||
@@ -338,7 +381,7 @@ const ItemTable: React.FC = () => {
|
|||||||
item.item_name +
|
item.item_name +
|
||||||
'" mit ID ' +
|
'" mit ID ' +
|
||||||
item.id +
|
item.id +
|
||||||
" bearbeitet."
|
" bearbeitet.",
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
@@ -356,7 +399,7 @@ const ItemTable: React.FC = () => {
|
|||||||
setError(
|
setError(
|
||||||
"success",
|
"success",
|
||||||
"Gegenstand gelöscht",
|
"Gegenstand gelöscht",
|
||||||
"Der Gegenstand wurde erfolgreich gelöscht."
|
"Der Gegenstand wurde erfolgreich gelöscht.",
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
@@ -372,6 +415,7 @@ const ItemTable: React.FC = () => {
|
|||||||
))}
|
))}
|
||||||
</Table.Body>
|
</Table.Body>
|
||||||
</Table.Root>
|
</Table.Root>
|
||||||
|
</Table.ScrollArea>
|
||||||
)}
|
)}
|
||||||
<Text>* LaP = Letzte ausleihende Person</Text>
|
<Text>* LaP = Letzte ausleihende Person</Text>
|
||||||
<Text>** Dav = Derzeit ausgeliehen von</Text>
|
<Text>** Dav = Derzeit ausgeliehen von</Text>
|
||||||
|
|||||||
@@ -1,5 +1,6 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import {
|
import {
|
||||||
|
Box,
|
||||||
Table,
|
Table,
|
||||||
Spinner,
|
Spinner,
|
||||||
Text,
|
Text,
|
||||||
@@ -31,7 +32,7 @@ const LoanTable: React.FC = () => {
|
|||||||
const setError = (
|
const setError = (
|
||||||
status: "error" | "success",
|
status: "error" | "success",
|
||||||
message: string,
|
message: string,
|
||||||
description: string
|
description: string,
|
||||||
) => {
|
) => {
|
||||||
setIsError(false);
|
setIsError(false);
|
||||||
setErrorStatus(status);
|
setErrorStatus(status);
|
||||||
@@ -65,7 +66,7 @@ const LoanTable: React.FC = () => {
|
|||||||
headers: {
|
headers: {
|
||||||
Authorization: `Bearer ${Cookies.get("token")}`,
|
Authorization: `Bearer ${Cookies.get("token")}`,
|
||||||
},
|
},
|
||||||
}
|
},
|
||||||
);
|
);
|
||||||
const data = await response.json();
|
const data = await response.json();
|
||||||
return data;
|
return data;
|
||||||
@@ -83,7 +84,7 @@ const LoanTable: React.FC = () => {
|
|||||||
}, [reload]);
|
}, [reload]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<Box h="full" display="flex" flexDirection="column" minH={0}>
|
||||||
{/* Action toolbar */}
|
{/* Action toolbar */}
|
||||||
<HStack
|
<HStack
|
||||||
mb={4}
|
mb={4}
|
||||||
@@ -131,7 +132,51 @@ const LoanTable: React.FC = () => {
|
|||||||
</VStack>
|
</VStack>
|
||||||
)}
|
)}
|
||||||
{!isLoading && (
|
{!isLoading && (
|
||||||
<Table.Root size="sm" striped>
|
<Table.ScrollArea flex="1" minH={0} rounded="md" mt={4}>
|
||||||
|
<Table.Root
|
||||||
|
size="sm"
|
||||||
|
striped
|
||||||
|
stickyHeader
|
||||||
|
css={{
|
||||||
|
"& [data-sticky]": {
|
||||||
|
position: "sticky",
|
||||||
|
zIndex: 1,
|
||||||
|
bg: "bg",
|
||||||
|
|
||||||
|
_after: {
|
||||||
|
content: '""',
|
||||||
|
position: "absolute",
|
||||||
|
pointerEvents: "none",
|
||||||
|
top: "0",
|
||||||
|
bottom: "-1px",
|
||||||
|
width: "32px",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
"& [data-sticky=end]": {
|
||||||
|
_after: {
|
||||||
|
insetInlineEnd: "0",
|
||||||
|
translate: "100% 0",
|
||||||
|
shadow: "inset 8px 0px 8px -8px rgba(0, 0, 0, 0.16)",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
"& [data-sticky=start]": {
|
||||||
|
_after: {
|
||||||
|
insetInlineStart: "0",
|
||||||
|
translate: "-100% 0",
|
||||||
|
shadow: "inset -8px 0px 8px -8px rgba(0, 0, 0, 0.16)",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
"& thead tr": {
|
||||||
|
shadow: "0 1px 0 0 {colors.border}",
|
||||||
|
"&:has(th[data-sticky])": {
|
||||||
|
zIndex: 2,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
>
|
||||||
<Table.Header>
|
<Table.Header>
|
||||||
<Table.Row>
|
<Table.Row>
|
||||||
<Table.ColumnHeader>
|
<Table.ColumnHeader>
|
||||||
@@ -193,7 +238,7 @@ const LoanTable: React.FC = () => {
|
|||||||
setError(
|
setError(
|
||||||
"success",
|
"success",
|
||||||
"Loan deleted",
|
"Loan deleted",
|
||||||
"The loan has been successfully deleted."
|
"The loan has been successfully deleted.",
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
@@ -209,8 +254,9 @@ const LoanTable: React.FC = () => {
|
|||||||
))}
|
))}
|
||||||
</Table.Body>
|
</Table.Body>
|
||||||
</Table.Root>
|
</Table.Root>
|
||||||
|
</Table.ScrollArea>
|
||||||
)}
|
)}
|
||||||
</>
|
</Box>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -8,9 +8,13 @@ export default defineConfig({
|
|||||||
plugins: [react(), svgr(), tailwindcss(), tsconfigPaths()],
|
plugins: [react(), svgr(), tailwindcss(), tsconfigPaths()],
|
||||||
server: {
|
server: {
|
||||||
host: "0.0.0.0",
|
host: "0.0.0.0",
|
||||||
port: 8003,
|
allowedHosts: ["admin.insta.the1s.de"],
|
||||||
watch: {
|
port: 8103,
|
||||||
usePolling: true,
|
watch: { usePolling: true },
|
||||||
|
hmr: {
|
||||||
|
host: "admin.insta.the1s.de",
|
||||||
|
port: 8103,
|
||||||
|
protocol: "wss",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|||||||
+3
-3
@@ -1,11 +1,11 @@
|
|||||||
{
|
{
|
||||||
"backend-info": {
|
"backend-info": {
|
||||||
"version": "v2.2 (dev)"
|
"version": "v2.2 (demo)"
|
||||||
},
|
},
|
||||||
"frontend-info": {
|
"frontend-info": {
|
||||||
"version": "v2.2 (dev)"
|
"version": "v2.2 (demo)"
|
||||||
},
|
},
|
||||||
"admin-panel-info": {
|
"admin-panel-info": {
|
||||||
"version": "v1.4(dev)"
|
"version": "v1.4 (demo)"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -29,14 +29,14 @@ export const createUser = async (
|
|||||||
};
|
};
|
||||||
|
|
||||||
export const deleteUserById = async (userId) => {
|
export const deleteUserById = async (userId) => {
|
||||||
const [result] = await pool.query("DELETE FROM users WHERE id = ?", [userId]);
|
const [result] = await pool.query("DELETE FROM users WHERE id = ? AND secret_user = false", [userId]);
|
||||||
if (result.affectedRows > 0) return { success: true };
|
if (result.affectedRows > 0) return { success: true };
|
||||||
return { success: false };
|
return { success: false };
|
||||||
};
|
};
|
||||||
|
|
||||||
export const changePassword = async (username, newPassword) => {
|
export const changePassword = async (username, newPassword) => {
|
||||||
const [result] = await pool.query(
|
const [result] = await pool.query(
|
||||||
"UPDATE users SET password = ?, entry_updated_at = NOW() WHERE username = ?",
|
"UPDATE users SET password = ?, entry_updated_at = NOW() WHERE username = ? AND secret_user = false",
|
||||||
[newPassword, username],
|
[newPassword, username],
|
||||||
);
|
);
|
||||||
if (result.affectedRows > 0) return { success: true };
|
if (result.affectedRows > 0) return { success: true };
|
||||||
@@ -52,7 +52,7 @@ export const editUserById = async (
|
|||||||
is_admin,
|
is_admin,
|
||||||
) => {
|
) => {
|
||||||
const [result] = await pool.query(
|
const [result] = await pool.query(
|
||||||
"UPDATE users SET first_name = ?, last_name = ?, role = ?, email = ?, is_admin = ?, entry_updated_at = NOW() WHERE id = ?",
|
"UPDATE users SET first_name = ?, last_name = ?, role = ?, email = ?, is_admin = ?, entry_updated_at = NOW() WHERE id = ? AND secret_user = false",
|
||||||
[first_name, last_name, role, email, is_admin, userId],
|
[first_name, last_name, role, email, is_admin, userId],
|
||||||
);
|
);
|
||||||
if (result.affectedRows > 0) return { success: true };
|
if (result.affectedRows > 0) return { success: true };
|
||||||
@@ -61,7 +61,7 @@ export const editUserById = async (
|
|||||||
|
|
||||||
export const getAllUsers = async () => {
|
export const getAllUsers = async () => {
|
||||||
const [result] = await pool.query(
|
const [result] = await pool.query(
|
||||||
"SELECT id, username, first_name, last_name, role, email, is_admin, entry_created_at, entry_updated_at FROM users",
|
"SELECT id, username, first_name, last_name, role, email, is_admin, entry_created_at, entry_updated_at FROM users WHERE secret_user = false",
|
||||||
);
|
);
|
||||||
if (result.length > 0) return { success: true, data: result };
|
if (result.length > 0) return { success: true, data: result };
|
||||||
return { success: false };
|
return { success: false };
|
||||||
@@ -69,7 +69,7 @@ export const getAllUsers = async () => {
|
|||||||
|
|
||||||
export const getUserById = async (userId) => {
|
export const getUserById = async (userId) => {
|
||||||
const [rows] = await pool.query(
|
const [rows] = await pool.query(
|
||||||
"SELECT id, username, first_name, last_name, role, email, is_admin FROM users WHERE id = ?",
|
"SELECT id, username, first_name, last_name, role, email, is_admin FROM users WHERE id = ? AND secret_user = false",
|
||||||
[userId],
|
[userId],
|
||||||
);
|
);
|
||||||
if (rows.length === 0) {
|
if (rows.length === 0) {
|
||||||
|
|||||||
@@ -0,0 +1,100 @@
|
|||||||
|
USE borrow_system_new;
|
||||||
|
|
||||||
|
-- USERS
|
||||||
|
INSERT INTO users (username, password, email, first_name, last_name, role, is_admin)
|
||||||
|
VALUES
|
||||||
|
('user1', 'passwordhash1', 'user1@example.com', 'First1', 'Last1', 1, false),
|
||||||
|
('user2', 'passwordhash2', 'user2@example.com', 'First2', 'Last2', 1, false),
|
||||||
|
('user3', 'passwordhash3', 'user3@example.com', 'First3', 'Last3', 2, false),
|
||||||
|
('admin1', 'passwordhash4', 'admin1@example.com', 'Admin', 'One', 9, true),
|
||||||
|
('admin2', 'passwordhash5', 'admin2@example.com', 'Admin', 'Two', 9, true);
|
||||||
|
|
||||||
|
-- ITEMS
|
||||||
|
INSERT INTO items (item_name, can_borrow_role, in_safe, safe_nr, door_key, last_borrowed_person, currently_borrowing)
|
||||||
|
VALUES
|
||||||
|
('Item1', 1, true, 1, 101, NULL, NULL),
|
||||||
|
('Item2', 1, true, 2, 102, 'user1', 'user1'),
|
||||||
|
('Item3', 2, true, 3, 103, 'user2', NULL),
|
||||||
|
('Item4', 1, false, NULL, NULL, NULL, NULL),
|
||||||
|
('Item5', 2, false, NULL, NULL, 'user3', 'user3');
|
||||||
|
|
||||||
|
-- LOANS
|
||||||
|
INSERT INTO loans (
|
||||||
|
username,
|
||||||
|
lockers,
|
||||||
|
loan_code,
|
||||||
|
start_date,
|
||||||
|
end_date,
|
||||||
|
take_date,
|
||||||
|
returned_date,
|
||||||
|
created_at,
|
||||||
|
loaned_items_id,
|
||||||
|
loaned_items_name,
|
||||||
|
deleted,
|
||||||
|
note
|
||||||
|
)
|
||||||
|
VALUES
|
||||||
|
(
|
||||||
|
'user1',
|
||||||
|
JSON_ARRAY('Locker1', 'Locker2'),
|
||||||
|
'123456',
|
||||||
|
'2026-02-01 09:00:00',
|
||||||
|
'2026-02-10 17:00:00',
|
||||||
|
'2026-02-01 09:15:00',
|
||||||
|
NULL,
|
||||||
|
'2026-02-01 09:00:00',
|
||||||
|
JSON_ARRAY(1, 2),
|
||||||
|
JSON_ARRAY('Item1', 'Item2'),
|
||||||
|
false,
|
||||||
|
'Erste allgemeine Ausleihe'
|
||||||
|
),
|
||||||
|
(
|
||||||
|
'user2',
|
||||||
|
JSON_ARRAY('Locker3'),
|
||||||
|
'234567',
|
||||||
|
'2026-02-02 10:00:00',
|
||||||
|
'2026-02-05 16:00:00',
|
||||||
|
'2026-02-02 10:05:00',
|
||||||
|
'2026-02-05 15:30:00',
|
||||||
|
'2026-02-02 10:00:00',
|
||||||
|
JSON_ARRAY(3),
|
||||||
|
JSON_ARRAY('Item3'),
|
||||||
|
false,
|
||||||
|
'Zurückgegeben vor Enddatum'
|
||||||
|
),
|
||||||
|
(
|
||||||
|
'user3',
|
||||||
|
JSON_ARRAY(),
|
||||||
|
'345678',
|
||||||
|
'2026-02-03 08:30:00',
|
||||||
|
'2026-02-15 18:00:00',
|
||||||
|
NULL,
|
||||||
|
NULL,
|
||||||
|
'2026-02-03 08:30:00',
|
||||||
|
JSON_ARRAY(5),
|
||||||
|
JSON_ARRAY('Item5'),
|
||||||
|
false,
|
||||||
|
'Noch ausgeliehen'
|
||||||
|
),
|
||||||
|
(
|
||||||
|
'user1',
|
||||||
|
JSON_ARRAY('Locker4'),
|
||||||
|
'456789',
|
||||||
|
'2025-12-01 09:00:00',
|
||||||
|
'2025-12-03 17:00:00',
|
||||||
|
'2025-12-01 09:10:00',
|
||||||
|
'2025-12-03 16:45:00',
|
||||||
|
'2025-12-01 09:00:00',
|
||||||
|
JSON_ARRAY(1),
|
||||||
|
JSON_ARRAY('Item1'),
|
||||||
|
true,
|
||||||
|
'Alte, gelöschte Ausleihe'
|
||||||
|
);
|
||||||
|
|
||||||
|
-- API KEYS
|
||||||
|
INSERT INTO apiKeys (api_key, entry_name)
|
||||||
|
VALUES
|
||||||
|
('10000001', 'Entry1'),
|
||||||
|
('10000002', 'Entry2'),
|
||||||
|
('10000003', 'Entry3'),
|
||||||
|
('10000004', 'Entry4');
|
||||||
@@ -11,6 +11,7 @@ CREATE TABLE users (
|
|||||||
is_admin bool NOT NULL DEFAULT false,
|
is_admin bool NOT NULL DEFAULT false,
|
||||||
entry_created_at timestamp NULL DEFAULT CURRENT_TIMESTAMP,
|
entry_created_at timestamp NULL DEFAULT CURRENT_TIMESTAMP,
|
||||||
entry_updated_at timestamp NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
|
entry_updated_at timestamp NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
|
||||||
|
secret_user bool NOT NULL DEFAULT false,
|
||||||
PRIMARY KEY (id)
|
PRIMARY KEY (id)
|
||||||
) ENGINE=InnoDB;
|
) ENGINE=InnoDB;
|
||||||
|
|
||||||
|
|||||||
@@ -15,6 +15,7 @@ This update provides some new features for the design. It also contains some imp
|
|||||||
- Improved error logging
|
- Improved error logging
|
||||||
- If you try to delete a loan that has not been returned yet, you will get an 507 error code.
|
- If you try to delete a loan that has not been returned yet, you will get an 507 error code.
|
||||||
- When the admin deletes a loan, the loan will be still visible in the database, but it will be marked as deleted. This is to prevent data loss and to keep track of deleted loans.
|
- When the admin deletes a loan, the loan will be still visible in the database, but it will be marked as deleted. This is to prevent data loss and to keep track of deleted loans.
|
||||||
|
- Mailer improvements: The mailer is now more clearly organised. Two large code files are now split into five smaller code files which are easier to maintain. Also the design of the mails has improved.
|
||||||
|
|
||||||
## Fixed bugs
|
## Fixed bugs
|
||||||
|
|
||||||
|
|||||||
+30
-26
@@ -1,46 +1,46 @@
|
|||||||
services:
|
services:
|
||||||
# usr-frontend_v2:
|
demo_usr_frontend:
|
||||||
# container_name: borrow_system-usr-frontend
|
container_name: demo_borrow_system-usr-frontend
|
||||||
# build: ./FrontendV2
|
networks:
|
||||||
# ports:
|
- proxynet
|
||||||
# - "8001:80"
|
build: ./FrontendV2
|
||||||
# restart: always
|
restart: unless-stopped
|
||||||
|
|
||||||
# admin-frontend:
|
demo_admin_frontend:
|
||||||
# container_name: borrow_system-admin-frontend
|
container_name: demo_borrow_system-admin-frontend
|
||||||
# build: ./admin
|
networks:
|
||||||
# ports:
|
- proxynet
|
||||||
# - "8003:80"
|
build: ./admin
|
||||||
# restart: always
|
restart: unless-stopped
|
||||||
|
|
||||||
backend_v2:
|
demo_backend_v2:
|
||||||
container_name: borrow_system-backend_v2
|
container_name: demo_borrow_system-backend_v2
|
||||||
|
networks:
|
||||||
|
- proxynet
|
||||||
build: ./backendV2
|
build: ./backendV2
|
||||||
ports:
|
|
||||||
- "8004:8004"
|
|
||||||
environment:
|
environment:
|
||||||
NODE_ENV: production
|
NODE_ENV: production
|
||||||
DB_HOST: mysql_v2
|
DB_HOST: demo_mysql_v2
|
||||||
DB_USER: root
|
DB_USER: root
|
||||||
DB_PASSWORD: ${DB_PASSWORD_V2}
|
DB_PASSWORD: ${DB_PASSWORD_V2}
|
||||||
DB_NAME: borrow_system_new
|
DB_NAME: borrow_system_new
|
||||||
depends_on:
|
depends_on:
|
||||||
- mysql_v2
|
- demo_mysql_v2
|
||||||
restart: always
|
restart: unless-stopped
|
||||||
|
|
||||||
mysql_v2:
|
demo_mysql_v2:
|
||||||
container_name: borrow_system-mysql-v2
|
container_name: demo_borrow_system-mysql-v2
|
||||||
|
networks:
|
||||||
|
- proxynet
|
||||||
image: mysql:8.0
|
image: mysql:8.0
|
||||||
restart: always
|
restart: unless-stopped
|
||||||
environment:
|
environment:
|
||||||
MYSQL_ROOT_PASSWORD: ${DB_PASSWORD_V2}
|
MYSQL_ROOT_PASSWORD: ${DB_PASSWORD_V2}
|
||||||
MYSQL_DATABASE: borrow_system_new
|
MYSQL_DATABASE: borrow_system_new
|
||||||
TZ: Europe/Berlin
|
TZ: Europe/Berlin
|
||||||
volumes:
|
volumes:
|
||||||
- mysql-v2-data:/var/lib/mysql
|
- demo_mysql-v2-data:/var/lib/mysql
|
||||||
- ./mysql-timezone.cnf:/etc/mysql/conf.d/timezone.cnf:ro
|
- ./mysql-timezone.cnf:/etc/mysql/conf.d/timezone.cnf:ro
|
||||||
ports:
|
|
||||||
- "3310:3306"
|
|
||||||
|
|
||||||
no-as-a-service:
|
no-as-a-service:
|
||||||
container_name: borrow_system-naas
|
container_name: borrow_system-naas
|
||||||
@@ -53,4 +53,8 @@ services:
|
|||||||
|
|
||||||
volumes:
|
volumes:
|
||||||
mysql-data:
|
mysql-data:
|
||||||
mysql-v2-data:
|
demo_mysql-v2-data:
|
||||||
|
|
||||||
|
networks:
|
||||||
|
proxynet:
|
||||||
|
external: true
|
||||||
|
|||||||
Reference in New Issue
Block a user