Assecutor/muh
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add customer search and navigation updates

Browse Source
This commit is contained in:
Sven Carstensen
2026-03-12 16:50:50 +01:00
parent 8ebb4d06e5
commit 1a8e37bd36
17 changed files with 710 additions and 137 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
frontend/src/pages/LoginPage.tsx
View File

@@ -12,6 +12,8 @@ export default function LoginPage() {
const [showRegistration, setShowRegistration] = useState(false);
const [identifier, setIdentifier] = useState("");
const [password, setPassword] = useState("");
const [showLoginValidation, setShowLoginValidation] = useState(false);
const [showRegisterValidation, setShowRegisterValidation] = useState(false);
const [registration, setRegistration] = useState({
companyName: "",
street: "",
@@ -28,6 +30,7 @@ export default function LoginPage() {
async function handlePasswordLogin(event: FormEvent<HTMLFormElement>) {
event.preventDefault();
setShowLoginValidation(true);
if (!identifier.trim() || !password.trim()) {
setFeedback({
type: "error",
@@ -49,6 +52,7 @@ export default function LoginPage() {
async function handleRegister(event: FormEvent<HTMLFormElement>) {
event.preventDefault();
setShowRegisterValidation(true);
if (
!registration.companyName.trim()
|| !registration.street.trim()
@@ -113,21 +117,23 @@ export default function LoginPage() {
<div className="auth-grid">
{!showRegistration ? (
<form className="login-panel__section" onSubmit={handlePasswordLogin}>
<label className="field">
<form className={`login-panel__section ${showLoginValidation ? "show-validation" : ""}`} onSubmit={handlePasswordLogin}>
<label className="field field--required">
<span>E-Mail / Benutzername</span>
<input
value={identifier}
onChange={(event) => setIdentifier(event.target.value)}
placeholder="z. B. admin oder name@hof.de"
required
/>
</label>
<label className="field">
<label className="field field--required">
<span>Passwort</span>
<input
type="password"
value={password}
onChange={(event) => setPassword(event.target.value)}
required
/>
</label>
<div className="page-actions">
@@ -139,6 +145,7 @@ export default function LoginPage() {
className="secondary-button"
onClick={() => {
setFeedback(null);
setShowRegisterValidation(false);
setShowRegistration(true);
}}
>
@@ -147,9 +154,9 @@ export default function LoginPage() {
</div>
</form>
) : (
<form className="login-panel__section" onSubmit={handleRegister}>
<form className={`login-panel__section ${showRegisterValidation ? "show-validation" : ""}`} onSubmit={handleRegister}>
<div className="field-grid">
<label className="field field--wide">
<label className="field field--wide field--required">
<span>Firmenname</span>
<input
value={registration.companyName}
@@ -157,9 +164,10 @@ export default function LoginPage() {
setRegistration((current) => ({ ...current, companyName: event.target.value }))
}
placeholder="z. B. Muster Agrar GmbH"
required
/>
</label>
<label className="field">
<label className="field field--required">
<span>Strasse</span>
<input
value={registration.street}
@@ -167,9 +175,10 @@ export default function LoginPage() {
setRegistration((current) => ({ ...current, street: event.target.value }))
}
placeholder="z. B. Dorfstrasse"
required
/>
</label>
<label className="field">
<label className="field field--required">
<span>Hausnummer</span>
<input
value={registration.houseNumber}
@@ -177,9 +186,10 @@ export default function LoginPage() {
setRegistration((current) => ({ ...current, houseNumber: event.target.value }))
}
placeholder="z. B. 12a"
required
/>
</label>
<label className="field">
<label className="field field--required">
<span>PLZ</span>
<input
value={registration.postalCode}
@@ -187,9 +197,10 @@ export default function LoginPage() {
setRegistration((current) => ({ ...current, postalCode: event.target.value }))
}
placeholder="z. B. 12345"
required
/>
</label>
<label className="field">
<label className="field field--required">
<span>Ort</span>
<input
value={registration.city}
@@ -197,9 +208,10 @@ export default function LoginPage() {
setRegistration((current) => ({ ...current, city: event.target.value }))
}
placeholder="z. B. Musterstadt"
required
/>
</label>
<label className="field">
<label className="field field--required">
<span>E-Mail</span>
<input
type="email"
@@ -207,19 +219,22 @@ export default function LoginPage() {
onChange={(event) =>
setRegistration((current) => ({ ...current, email: event.target.value }))
}
required
/>
</label>
<label className="field">
<label className="field field--required">
<span>Telefonnummer</span>
<input
type="tel"
value={registration.phoneNumber}
onChange={(event) =>
setRegistration((current) => ({ ...current, phoneNumber: event.target.value }))
}
placeholder="z. B. 04531 181424"
required
/>
</label>
<label className="field field--wide">
<label className="field field--wide field--required">
<span>Passwort</span>
<input
type="password"
@@ -227,19 +242,30 @@ export default function LoginPage() {
onChange={(event) =>
setRegistration((current) => ({ ...current, password: event.target.value }))
}
required
/>
</label>
<label className="field field--wide">
<label className="field field--wide field--required">
<span>Passwort wiederholen</span>
<input
type="password"
value={registration.passwordConfirmation}
className={
showRegisterValidation
&& registration.password !== registration.passwordConfirmation
? "is-invalid"
: ""
}
aria-invalid={
showRegisterValidation && registration.password !== registration.passwordConfirmation
}
onChange={(event) =>
setRegistration((current) => ({
...current,
passwordConfirmation: event.target.value,
}))
}
required
/>
</label>
</div>
@@ -252,6 +278,7 @@ export default function LoginPage() {
className="secondary-button"
onClick={() => {
setFeedback(null);
setShowLoginValidation(false);
setShowRegistration(false);
}}
>